HTML

HAMEDA HURMAT

HTML Short QuotationsThe HTML <q> element defines a short quotation.

Browsers usually insert quotation marks around the <q> element.

<p>goal is to: <q>Build a future where people live in harmony with nature.</q></p>

Bdo

The bdo element is used to “override the Unicode bidirectional algorithm”, which in layman’s terms means reversing the direction of text enclosed between the opening <bdo> and closing </bdo> tags.

<bdo dir=" { ltr | rtl } "> Correct one</bdo>

Dfn

The dfn element is used to identify the defining instance of a term

<p>The concept of <dfn>progressive enhancement</dfn> has been about for a few years. </p>

HTML <abbr> Tag

The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.

Tag Description

<abbr> Defines an abbreviation or acronym

<address> Defines contact information for the author/owner of a document

<bdo> Defines the text direction

<blockquote> Defines a section that is quoted from another source

<q> Defines an inline (short) quotation

<cite>Defines the title of a work, to identify the contained text as a reference to another source

<dfn> Defines a definition termd

HTML Long Quotations

The HTML <blockquote> element defines a quoted section.

Browsers usually indent <blockquote> elements.

<blockquote>For 50 years, WWF has been protecting the future of nature.The world's leading conservation organization,</blockquote>

HTML CommentsComments are not displayed by the browser, but they can help document your HTML.

With comments you can place notifications and reminders in your HTML.

<!-- Write your comments here -->

HTML LinksLinks are found in nearly all web pages. Links allow users to click their way from page to page.

HTML Links - Syntax

In HTML, links are defined with the <a> tag:

<a href="url">link text</a>

Local Links

A local link (link to the same web site) is specified with a relative URL (without http://www....).

<a href="html_images.asp">HTML Images</a>

HTML Links - The target AttributeThe target attribute specifies where to open the linked document.

This example will open the linked document in a new browser window or in a new tab:

<a href="http://www.google.com/” target="_blank">google!</a>

Target Value Description

_blank Opens the linked document in a new window or tab

_selfOpens the linked document in the same frame as it was clicked (this is default)

_parent Opens the linked document in the parent frame

_topOpens the linked document in the full body of the window

framename Opens the linked document in a named frame

HTML ImagesHTML Images Syntax

In HTML, images are defined with the <img> tag.

The <img> tag is empty, it contains attributes only, and does not have a closing tag.

The src attribute defines the url (web address) of the image:

<img src="url" alt="some_text">

The alt AttributeThe alt attribute specifies an alternate text for the image, if it cannot be displayed.

The value of the alt attribute should describe the image in words:

Example

<img src="html5.gif" alt="The official HTML5 Icon">

Image Size - Width and HeightYou can use the style attribute to specify the width and height of an image.

The values are specified in pixels (use px after the value):

<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px">

Alternatively, you can use width and height attributes.

The values are specified in pixels (without px after the value):

<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">

HTML Links - Image as LinkIt is common to use images as links:

<a href="default.asp"><img src="smiley.gif" alt="HTML tutorial"

style="width:42px;height:42px;border:0"></a>

Thank You