Elementary Standards HTML Tutorial
The tutorials found herein have been written for clarification of existing W3C HTML 4.01 (and, by extension, XHTML 1.0 as text/html) documentation and use real-world examples. W3C HTML 5 (Draft) clarification and examples are included.
Elements :
Attributes
Sections of elements are below. The attributes, too. Some section names have been taken from HTML 5; some remain HTML 4.01. Text-Level Elements - in HTML 5 - have become Text-Level Semantics but some were reclassified as Grouping or Phrasing Content; List elements are Grouping Content.
Head Elements
Flow Elements
Section Content Elements
Block-Level Elements
List Elements
Text-Level Elements
Empty Elements
Attributes
id
The id attribute assigns a unique identifier to an element. This name must be used used once only in a document.
- The
idattribute has several rôles in HTML: - Style sheet selector.
- Target anchor with a fragment identifier for hypertext links.
- Label element with form control.
- Script reference of a particular element.
Objectelement name.- General purpose processing by user agents (e.g. for identifying fields when extracting data from HTML pages into a database, translating HTML documents into other formats et al).
- Note: HTML Validation errors occur when an
idattribute is used in multiple instances. Dynamically-generated content, e.g., includes, or scripts/CSS-hidden content where numerous elements are identified by anidattribute are—Usually—responsible. - Style sheets: Browsers [Safari, Firefox/Mac, Opera/Mac, Firefox/PC, Opera/PC, IE6 and IE7] will render
idstyles on all elements when multipleidattributes are assigned in a single page. [See Multiple Identifiers (ID) CSS test.] - Anchor targets: The target anchor with multiple
idattributes assigned—on a single page—has two different results: Opera (Mac/PC) renders the “Sixth” anchor whereas all other tested browsers (Safari, Firefox/Mac, Firefox/PC, IE6 and IE7) rendered the “First” anchor. [See Multiple Identifiers (ID) Anchor test.] - Label element: Multiple
idattributes cause failures. - Script reference: Multiple
idattributes cause failures. Objectelement name: Multipleidattributes cause failures.- General purpose processing: Multiple
idattributes cause failures.
- Attribute name:
id- Value:
- Text [1]
- Example [Basic (Flow Element)]:
- Code [HTML]:
-
<div id="fluidity"> - Code [CSS]:
-
div#fluidity { position: relative; margin: 25px 240px 30px 360px; padding: 0 10px 0 20px; }
- Example [Basic (Text-Level Element)]:
-
IDattributes may only be used once on a page. - Code [HTML]:
-
<h3 id="directorySubHeader"> <code>ID</code> attributes may only be used once on a page.</h3> - Code [CSS]:
-
h3#directorySubHeader { margin-bottom: 25px; margin-left: 8px; color: #000; font: 1.4em Palatino, "Times New Roman", Times, serif; }
- Example [Mandarin (Page-specific CSS Styles)]:
-
ID属性应该只能使用一次的网页上. - Code [HTML]:
-
<h3 id="月光"><code>ID</code> <span lang="zh-cn">属性应该只能使用一次的网页上</span>.</h3> - Code [CSS]:
-
#月光 { padding: 20px 0 20px 30px; color: #a60000; font-size: 3em; } /* #a60000 = 8.01:1/Passed at Level AAA */ -
- Notes:
-
charset=utf-8used.- HTML 5 passes HTML Validation but fails CSS Validation. See Language Characters Used in Identifier (
ID) Values (HTML 5 Version). - HTML 4.01/Strict fails HTML Validation and CSS Validation. See Language Characters Used in Identifier (
ID) Values (HTML 4.01/Strict Version). - HTML 4.01/Transitional fails HTML Validation and CSS Validation. See Language Characters Used in Identifier (
ID) Values (HTML 4.01/Transitional Version). - xHTML 1.0/Strict passes HTML Validation but fails CSS Validation. See Language Characters Used in Identifier (
ID) Values (xHTML 1.0/Strict Version). - xHTML 1.0/Transitional passes HTML Validation but fails CSS Validation. See This HTML 5/Hack Version passes HTML Validation but partially fails CSS Validation. See Language Characters Used in Identifier (
ID) Values (Hack Version). DocTypesare noted.
- ^Attribute Names/Values Guidelines:
- CSS requires HTML Identifier Attributes, i.e.,
names,classes, andIDs, are written so that the first character is a letter [ a-z and A-Z ] or hyphen [ - ] or underscore [ _ ] but cannot start with a digit [ 0-9 ], or a hyphen followed by a digit (e.g, -9). - (x)HTML specifications state that attribute values may only contain letters [ a-z and A-Z ], digits [ 0-9 ], hyphens [ - ], periods [ . ], underscores [ _ ], and colons [ : ].
- All attribute values should be delimited using double (straight) quotation marks (").
The Elementary Standards: A Compendium of articles, tutorials and reference material regarding Web Standards, HTML and CSS Copyright ©2005-2010. All work is published by Sean Fraser under a Creative Commons License. All Rights Reserved.