HTML Paragraphs Paragraphs are defined with the tag. Example This is a paragraph This is another paragraph

HTML Headings HTML headings are defined with the to tags. Example This is a heading This is a heading This is a heading

HTML Links HTML links are defined with the tag. Example This is a link

HTML Images HTML images are defined with the tag. Example

HTML Elements HTML documents are defined by HTML elements. An HTML element is everything from the start tag to the end tag: Start tag * Element content End tag * This is a paragraph This is a link * The start tag is often called the opening tag. The end tag is often called the closing tag.

HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Attributes are always specified in the start tag Attributes come in name/value pairs like: name="value" Example This is a link

Most HTML elements

HTML Comments Example

HTML Attributes Core Attributes(Valid in all elements, except:,,,,,,, and. Language AttributesValid in all elements, except:,,,,,,, and. Keyboard Attributes

Language attribute Keyboard Attributes Core Attributes

Class example h1.intro {color:blue;} p.important {color:red;} Header 1 A paragraph. Note that this is an important paragraph.

ID Example function displayResult() { document.getElementById("myHeader").innerHTML="Have a nice day!"; } Hello World! Change text

HTML accesskey Attribute Definition and UsageThe accesskey attribute specifies a shortcut key to activate/focus an element. HTML5 tutorial CSS3 tutorial Note: Use Alt + accessKey (or Shift + Alt + accessKey ) to access the element with the specified access key.

URI,URL and URN The relationship of URL to URI and URNURIURN Abbreviation of Uniform Resource Locator (URL) it is the global address of documents and other resources on the World Wide Web.addressdocumentsresourcesWorld Wide Web scheme://domain:port/path?query_string#fragment_id Schema or protocol : http or ftp or https, … domain : www Port : 80 sub domain: primary/teacher URN : Index.html A URL is one type of Uniform Resource Identifier (URI); the generic term for all types of names and addresses that refer to objects on the World Wide Web.URIWorld Wide Web

HTML tabindex Attribute example Definition and Usage The tabindex attribute specifies the tab order of an element (when the "tab" button is used for navigating). W3Schools Google Microsoft Note: Try navigating the links by using the "Tab" button on you keyboard.

HTML Tag Reference

The element is an empty HTML element. It has no end tag. or In XHTML, XML, elements with no end tag (closing tag) are not allowed. Even if works in all browsers, writing instead works better in XHTML and XML applications.

You cannot be sure how HTML will be displayed. Large or small screens, and resized windows will create different results. With HTML, you cannot change the output by adding extra spaces or extra lines in your HTML code. The browser will remove extra spaces and extra lines when the page is displayed. Any number of lines count as one line, and any number of spaces count as one space.

HTML Text Formatting

HTML Text Formatting Tags

HTML "Computer Output" Tags

HTML Citations, Quotations, and Definition Tags

HTML Tag

HTML Tags

HTML Tag

Horizontal line <hr size="18" width="60%" align="center" color="green"

Horizontal line thanks for visiting us thanks for visiting us thanks for visiting us

The HTML Tag Should NOT be Used The tag is deprecated in HTML 4, and removed from HTML5. The World Wide Web Consortium (W3C) has removed the tag from its recommendations. In HTML 4, style sheets (CSS) should be used to define the layout and display properties for many HTML elements.

Styling HTML with CSS

CSS is used to style HTML elements

HTML Style Example - Font, Color and Size

HTML Style Example - Text Alignment

Deprecated ” مستنكر “Tags and Attributes

HTML Links - The target Attribute

HTML Links

HTML Images

How to align an image within the text.

How to let an image float to the left or right of a paragraph.

How to use an image as a link.

How to create an image map, with clickable regions. Each of the regions is a hyperlink

HTML Image Tags