HTML XHTML Pocket Reference Quick, Comprehensive, Indispensible (Jennifer Niederst Robbins) (Z-Library)

HTML and XHTML Pocket Reference

FOURTH EDITION HTML and XHTML Pocket Reference Jennifer Niederst Robbins Beijing • Cambridge • Farnham • Köln • Sebastopol • Taipei • Tokyo

HTML and XHTML Pocket Reference, Fourth Edition by Jennifer Niederst Robbins Copyright © 2010 Jennifer Niederst Robbins. All rights reserved. Printed in Canada. Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Se- bastopol, CA 95472. O’Reilly books may be purchased for educational, business, or sales promo- tional use. Online editions are also available for most titles (http://my.safari booksonline.com). For more information, contact our corporate/institutional sales department: (800) 998-9938 or corporate@oreilly.com. Editors: Steven Weiss and Simon St.Laurent Production Editor: Loranah Dimant Proofreader: Loranah Dimant Indexer: Ellen Troutman Zaig Cover Designer: Karen Montgomery Interior Designer: David Futato Illustrator: Robert Romano Printing History: January 2000: First Edition. January 2002: Second Edition. May 2006: Third Edition. December 2009: Fourth Edition. Nutshell Handbook, the Nutshell Handbook logo, and the O’Reilly logo are registered trademarks of O’Reilly Media, Inc. HTML & XHTML Pocket Reference, the image of a koala, and related trade dress are trademarks of O’Reilly Media, Inc. Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in this book, and O’Reilly Media, Inc. was aware of a trademark claim, the designations have been printed in caps or initial caps. While every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions, or for damages resulting from the use of the information contained herein. ISBN: 978-0-596-80586-9 [TM] 1260541301

Contents HTML and XHTML Pocket Reference 1 HTML 4.01 Overview 2 HTML5 Overview 4 XHTML Overview 8 Common Attributes and Events 12 Alphabetical List of Elements 17 Elements Organized by Function 151 Character Entities 153 Specifying Color 166 Index 169 v

HTML and XHTML Pocket Reference HTML (HyperText Markup Language) is the markup language used to turn text documents into web pages and applications. The fundamental purpose of HTML as a markup language is to provide a semantic description (the meaning) of the content and establish a document structure (a hierarchy of elements). It is not concerned with presentation, such as how the docu- ment will look in a browser. Presentation is the job of Cascad- ing Style Sheets, which is outside the scope of this book. This pocket reference provides a concise yet thorough listing of the elements and attributes specified in the HTML 4.01 and XHTML 1.0 Recommendations as well as HTML5, which is in development as a Working Draft as of this writing. The text uses the shorthand “(X)HTML” for concepts that apply to all of these markup standards. For updates and details on all versions, see the W3C’s HTML home page at www.w3.org/html. HTML5 is a joint effort be- tween the W3C and the WHATWG (Web Hypertext Appli- cation Technology Working Group). See the latest HTML5 developments at www.whatwg.org/specs. 1

This book is organized into the following sections: • “HTML 4.01 Overview” • “HTML5 Overview” • “XHTML Overview” • “Common Attributes and Events” • “Alphabetical List of Elements” • “Elements Organized by Function” • “Character Entities” • “Specifying Color” HTML 4.01 Overview The HTML 4.01 Recommendation (1999) is the best estab- lished and supported HTML specification as of this writing. This section covers the basic structure of HTML 4.01 documents. Three Versions of HTML 4.01 Both the HTML 4.01 and XHTML 1.0 Recommendations en- compass three slightly different specification documents, called Document Type Definitions (or DTDs). DTDs define ev- ery element, attribute, and entity along with the rules for their use. The three versions are: Transitional DTD The Transitional DTD includes all deprecated elements and attributes in order to be backward compatible with the legacy behavior of most browsers. Deprecated ele- ments and attributes are permitted but discouraged from use. Strict DTD This version excludes all elements and attributes that have been deprecated (such as font and align) to reinforce the separation of document structure from presentation. 2 | HTML and XHTML Pocket Reference

Frameset DTD The Frameset DTD includes the same elements as the Transitional DTD with the addition of elements for cre- ating framed web pages (frameset, frame, and noframe). The Frameset DTD is kept separate because the structure of a framed document (where frameset replaces body) is fundamentally different from regular HTML documents. HTML 4.01 Document Structure This markup sample shows the minimal structure of an HTML 4.01 document. This example uses the Strict HTML DTD: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Document Title</title> </head> <body> Content of document . . . </body> </html> HTML 4.01 DOCTYPE Declarations The first line of the document structure example just shown is the Document Type Declaration (or DOCTYPE declaration) that declares the DTD version used for the document. It is used to check the document for validity. Some browsers also use the inclusion of a complete DOCTYPE declaration to switch into a standards-compliant rendering mode. The <!DOCTYPE> (document type) declaration contains two methods for pointing to DTD information: one is a publicly recognized document identifier, and the other is a specific URL in case the browsing device does not recognize the public iden- tifier. The DOCTYPE declarations for each HTML version must be used exactly as they appear here: HTML 4.01 Overview | 3

HTML 4.01 Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/HTML4.01/strict.dtd"> HTML 4.01 Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/HTML4.01/loose.dtd"> HTML 4.01 Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/HTML4.01/frameset.dtd"> HTML5 Overview HTML5, which aims to make HTML more useful for creating web applications as well as semantically marked up docu- ments, is not yet a formal Recommendation as of this writing, however, it is beginning to gain browser support and is already being used for web and mobile application development. HTML5 uses HTML 4.01 and the legacy behavior of browsers as a starting point, using the Document Object Model (DOM, the “tree” formed by a document’s structure) as its basis rather than a particular set of syntax rules. HTML5 can be written with HTML syntax (called the HTML serialization of HTML5) or according to the stricter syntax of XML (XML serialization, or “XHMTL 5”) if XML parsing is required. NOTE Because HTML5 is still in development, the details are changing rapidly. The HTML5 elements and attributes in this book are based on the WHATWG HTML5 Working Draft dated December 9, 2009. For the most recent version, go to www.whatwg.org/ specs/web-apps/current-work/multipage/. For a list of the ways HTML5 differs from HTML 4.01, see dev.w3.org/ html5/html4-differences. 4 | HTML and XHTML Pocket Reference

New in HTML5 HTML5 offers new features (elements, attributes, event han- dlers, and APIs) for easier web application development and more sophisticated form handling. There are also new seman- tic elements for marking up page content. Most of the purely presentational or poorly supported elements and attributes in HTML 4.01 have been dropped from HTML5, however, a few have been redefined or reinstated. Elements Details for each of these elements may be found later in the section “Alphabetical List of Elements”: article footer rp aside header rt audio hgroup ruby canvas keygen section command mark source datalist meter time details nav video embed output figure progress New input Types HTML5 introduces the following new input control types (in- dicated as values for the type attribute for the input element): color, date, datetime, datetime-local, email, month, number, range, search, tel, time, url, week. Attributes and Events The Global Attributes and Events available for all elements in HTML5 are listed and described in detail in the “Common At- tributes and Events” section. New HTML5 attributes are listed with their respective elements and labeled HTML5 only in the “Alphabetical List of Elements” section. HTML5 Overview | 5

APIs With a growing demand for interactive content on web pages, HTML5 introduces several APIs (Application Programming Interfaces) for standardizing the creation of web applications. There are APIs for the following: • Two-dimensional drawing in conjunction with the new canvas element • Playing video and audio files, used with the new video and audio elements • Offline web applications • Registering applications for certain protocols or media types • Editing documents, including a new global contentedita ble attribute • Drag and drop functionality (including the new dragga ble attribute) • Exposing the browser history and allowing pages to add to without breaking the back button • Cross-document messaging HTML5 Document Structure HTML5 has only one version and does not reference a DTD, but HTML5 documents still require a simplified DOCTYPE declaration to trigger standards mode rendering in browsers. The following is the basic structure of an HTML5 document: <!DOCTYPE html> <html> <head> <title>Document Title</title> </head> <body> Content of document . . . </body> </html> 6 | HTML and XHTML Pocket Reference

HTML5 documents written in XML syntax do not require a DOCTYPE but may include an XML declaration. They should also be served as the MIME type application/xhtml+xml or application/xml. The following is a simple HTML5 document written in the XML syntax: <?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Document Title</title> </head> <body> Content of document . . . </body> </html> HTML5 Browser Support As of this writing, HTML5 is still in its earliest days and has only limited browser support. A few features are supported in Firefox 3.5+, Safari 3+, Chrome 2+, and Opera 9+ (Opera supports nearly all of the HTML5 Forms features). Internet Explorer supports contentEditable, but otherwise has not promised support for HTML5 in its version 10 release, so we’ll have to stay tuned a while to see what comes after that. In the meantime, JavaScript can be used to make browsers recognize HTML5 elements. Many developers are looking to the mobile world as the arena where HTML5 will take hold in the form of web-based applications. The following resources are useful for tracking HTML5 real- world support and use: • “When Can I Use...” (a.deveria.com/caniuse/): A compar- ison of browser support for HTML5, CSS3, and other web technologies maintained by Alexis Deveria. • Wikipedia “Comparison of Layout Engines (HTML5)” (en.wikipedia.org/wiki/Comparison_of_layout_en gines_(HTML_5)): Charts show HTML5 support by the major browser layout engines. HTML5 Overview | 7

• HTML5 Doctor, Helping you Implement HTML5 today (html5doctor.com): Articles about HTML5 development and implementation, curated by Richard Clark, Bruce Lawson, Tom Leadbetter, Jack Osborne, Mike Robinson, and Remy Sharp. XHTML Overview XHTML 1.0 (eXtensible HyperText Markup Language) is a re- formulation of HTML 4.01 according to the stricter syntax rules of XML (eXtensible Markup Language). In other words, the elements are the same, but there are additional restrictions for document markup as listed in the next section. On July 2, 2009, the World Wide Web Consortium (W3C) officially discontinued the XHTML 2.0 project, focusing its re- sources instead on HTML5 (which can also be written in XML syntax). Although no new XHTML specifications are being developed, XHTML documents will continue to be supported by popular browsers for the foreseeable future. How XHTML Differs from HTML Because XHTML is an XML language, its syntax is stricter and differs from HTML in these key ways: • All element names and attributes must be lowercase. For example, <a href="example.com">...</a>. • All elements must be terminated—that is, they must in- clude an end tag. For example, <p>...</p>. • Empty elements must be terminated as well. This is done by including a slash at the end of the tag. A space is com- monly added before the slash for backward compatibility with older browsers. For example, <hr />, <img />, <meta />. • All attribute values must be contained in quotation marks (either single or double). For example, <td colspan="2">. 8 | HTML and XHTML Pocket Reference

• All attribute values must be explicit and may not be minimized to one word, as is permitted in HTML. For example: — checked="checked" — selected="selected" — multiple="multiple" • Nesting restrictions are more strictly enforced. These re- strictions are explicitly stated: — An a element cannot contain another a element. — The pre element cannot contain img, object, applet, big, small, sub, sup, font, or basefont. — The form element may not contain other form elements. — A button element cannot contain a, form, input, select, textarea, label, button, iframe, or isindex. — The label element cannot contain other label elements. • The special characters <, >, &, ', and " must always be rep- resented by their character entities, including when they appear within attribute values. For example, &lt;, &gt;, &amp;, &apos;, and &quot; (respectively). • In HTML, the name attribute may be used for the elements a, applet, form, frame, iframe, img, and map. The name at- tribute and the id attribute may be used in HTML to iden- tify document fragments. XHTML documents must use id instead of name for identifying document fragments in the aforementioned elements. In fact, the name attribute for these elements has been deprecated in the XHTML 1.0 specification. • XHTML documents should be served as XML applica- tions, not as HTML text documents. More specifically, the server should be configured to serve XHTML docu- ments with the Content-type header set to application/ xhtml+xml. If it is not possible to configure the server, the content type may be specified in a meta element in the document’s head, as shown in this example: XHTML Overview | 9

<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" /> Unfortunately, some popular browsers (Internet Explorer in particular) cannot parse XHTML documents as XML, causing pages to break. For this reason, many developers serve XHTML documents as text/html instead, although the W3C discourages this, and it is not possible if the document includes code from other XML namespaces. For more information on XHTML MIME types, see www.w3.org/TR/xhtml-media-types/. XHTML 1.0 Document Structure Like HTML 4.01, XHTML 1.0 has three DTD versions: tran- sitional, strict, and frameset. This markup sample shows the minimal structure of an XHTML 1.0 document as specified in the XHTML 1.0 Rec- ommendation. This document was written using the XHTML Transitional DTD: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ /EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional. dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Document Title</title> </head> <body> Content of document . . . </body> </html> Note that the html root element includes XML namespace (xmlns) and language (xml:lang) identification. XHTML documents may optionally include an XML declara- tion before the DOCTYPE declaration, as shown in this example: 10 | HTML and XHTML Pocket Reference

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> An XML declaration is not required when the character en- coding is the UTF-8 default. Because XML declarations are problematic for even standards-compliant browsers as of this writing, they are generally omitted. NOTE XHTML5 documents do not require a DOCTYPE declaration. XHTML DOCTYPE Declarations The DOCTYPE declarations for each XHTML version must be used exactly as they appear here: XHTML 1.0 Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> XHTML 1.0 Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML 1.0 Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> XHTML 1.1 The XHTML 1.1 Recommendation features only one DTD that is similar to Strict in that it does not include deprecated ele- ments and attributes: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> XHTML Overview | 11

Common Attributes and Events A number of attributes are shared by nearly all elements. To save space, they have been abbreviated in this reference as they are in the Recommendations. This section serves as a reference for “Alphabetical List of Elements” and explains each attrib- ute’s shorthand. In HTML 4.01/XHTML 1.0, the attributes and events are divi- ded into groups called Core, Internationalization, Focus, and Events. In HTML5, there is one set of Global Attributes that applies to all HTML elements. HTML 4.01 and XHTML 1.0 Core When Core is listed under Attributes, it refers to the set of core attributes that may be applied to the majority of elements (as noted in each element listing): id Assigns a unique identifying name to the element class Assigns one or more classification names to the element style Associates style information with an element title Provides a title or advisory information about the element Internationalization When Internationalization appears in the attribute list, it means the element accepts the set of attributes used to specify language and reading direction: dir Specifies the direction of the element (left to right or right to left). 12 | HTML and XHTML Pocket Reference