HTML & CSS The Complete Reference, 5th Edition
HTML & CSS:
The Complete Reference, Fifth Edition About the Author
ThomasA.Powell(tpowell@pint.com) isalong-time
industryveteran.AfteranearlystintatCERFnetinthe early‘90s,hefoundedPowellInternetConsulting(later renamedPINT)in1994,aWebdesignandconsultingservices firm.Today,PINT(pint.com)providesWebdevelopment, design,andconsultingservicestolargeandsmallcorporations allovertheUnitedStatesinavarietyofindustries.
BeyondhisinvolvementatPINT,Thomasisheavily involvedintheacademiccommunity.Hedevelopedthe UniversityofCalifornia,SanDiegoExtensionWebPublishing programinthelate1990sandcontinuestoteachclassesthere inWebdevelopmentanddesign.Heisalsoaninstructorfor theUCSDComputerScienceDepartment,whereheteaches classesinWebdevelopmentandthetheoryofprogramming languages.
Mr.Powelliswellpublished,andhisworkhasappeared innumeroustradepublications.Hecontinuestopublish regularlyinNetworkWorld.Healsohaspublishednumerous booksonWebtechnologyanddesign,includingAjax:The
CompleteReference, JavaScript:TheCompleteReference,and
manyothers.Hisbookshavebeentranslatedintoover 12languagesandareusedaroundtheworldbothinindustry andcollegesettings.
About the Technical Editor
JamesH.(Jim)Pence isafull-timewriter,editor,speaker,
singer,andperformancechalkartist.Jimbrokeintobook publishingin2001withHowtoDoEverythingwithHTML, ahow-tobookonWebauthoring,written“byanontechiefor nontechies,”andpublishedbyMcGraw-HillProfessional.He followedthisbookthesameyearwithanotherbookfor McGraw-Hill:CascadingStyleSheets:ABeginner’sGuide. McGraw-HillpublishedasecondeditionofJim’sHTML book,re-titledHowtoDoEverythingwithHTML&XHTML, in2003.
Jimisalsoapublishednovelist.HeistheauthorofBlind
Sight (Tyndale,2003),asuspense/thrillernovelsetinthe
mind-controlcults,andTheAngel(Kregel,2006),setagainst thebackdropoftheeuthanasiaandphysician-assistedsuicide movements.Jimmovedinto“truecrime”writingwithhis latestbook,TerrorbyNight(Tyndale,2009).TerrorbyNightis thetruestoryofthebrutal2008murdersoftheCaffeyfamily inEmory,Texas.YoucanlearnmoreaboutJim’sbooksand othercreativeprojectsathisWebsite:www.jamespence.com.
HTML & CSS:
The Complete Reference,
Fifth EditionThomasA.Powell NewYorkChicagoSanFrancisco LisbonLondonMadridMexicoCity MilanNewDelhiSanJuan SeoulSingaporeSydneyToronto
Copyright © 2010 by The McGraw-Hill Companies. All rights reserved. Except as permitted under the United States Copyright Act of 1976, no
part of this publication may be reproduced or distributed in any form or by any means, or stored in a database or retrieval system, without the
prior written permission of the publisher.ISBN: 978-0-07-174170-5 MHID: 0-07-174170-4 The material in this eBook also appears in the print version of this title: ISBN: 978-0-07-149629-2, MHID: 0-07-149629-7.
All trademarks are trademarks of their respective owners. Rather than put a trademark symbol after every occurrence of a trademarked name,
we use names in an editorial fashion only, and to the benefit of the trademark owner, with no intention of infringement of the trademark. Where
such designations appear in this book, they have been printed with initial caps.McGraw-Hill eBooks are available at special quantity discounts to use as premiums and sales promotions, or for use in corporate training
programs. To contact a representative please e-mail us at bulksales@mcgraw-hill.com.Information has been obtained by McGraw-Hill from sources believed to be reliable. However, because of the possibility of human or
mechanical error by our sources, McGraw-Hill, or others, McGraw-Hill does not guarantee the accuracy, adequacy, or completeness of any
information and is not responsible for any errors or omissions or the results obtained from the use of such information. TERMS OF USEThis is a copyrighted work and The McGraw-Hill Companies, Inc. (“McGraw-Hill”) and its licensors reserve all rights in and to the work.
Use of this work is subject to these terms. Except as permitted under the Copyright Act of 1976 and the right to store and retrieve one copy of
the work, you may not decompile, disassemble, reverse engineer, reproduce, modify, create derivative works based upon, transmit, distribute,
disseminate, sell, publish or sublicense the work or any part of it without McGraw-Hill’s prior consent. You may use the work for your own
noncommercial and personal use; any other use of the work is strictly prohibited. Your right to use the work may be terminated if you fail to
comply with these terms.THE WORK IS PROVIDED “AS IS.” McGRAW-HILL AND ITS LICENSORS MAKE NO GUARANTEES OR WARRANTIES AS TO THE
ACCURACY, ADEQUACY OR COMPLETENESS OF OR RESULTS TO BE OBTAINED FROM USING THE WORK, INCLUDING ANY
INFORMATION THAT CAN BE ACCESSED THROUGH THE WORK VIA HYPERLINK OR OTHERWISE, AND EXPRESSLY
DISCLAIM ANY WARRANTY, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO IMPLIED WARRANTIES OF
MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. McGraw-Hill and its licensors do not warrant or guarantee that the
functions contained in the work will meet your requirements or that its operation will be uninterrupted or error free. Neither McGraw-Hill nor
its licensors shall be liable to you or anyone else for any inaccuracy, error or omission, regardless of cause, in the work or for any damages
resulting therefrom. McGraw-Hill has no responsibility for the content of any information accessed through the work. Under no circumstances
shall McGraw-Hill and/or its licensors be liable for any indirect, incidental, special, punitive, consequential or similar damages that result from
the use of or inability to use the work, even if any of them has been advised of the possibility of such damages. This limitation of liability shall
apply to any claim or cause whatsoever whether such claim or cause arises in contract, tort or otherwise.Contents at a Glance
Part I Core Markup 1 TraditionalHTMLandXHTML ....................................
3
2 IntroducingHTML5 .............................................. 55
3 HTMLandXHTMLElementReference ............................. 133
Part II Core Style 4 IntroductiontoCSS .............................................. 429
5 CSSSyntaxandPropertyReference ................................ 521
6 CSS3ProprietaryandEmergingFeaturesReference .................. 613
Part III Appendixes
A CharacterEntities ................................................ 727
B Fonts ............................................................ 751
C Colors ........................................................... 765
D URLs ............................................................ 783
E ReadingaDocumentTypeDefinition .............................. 801
Index ........................................................... 809
vThis page intentionally left blank
Contents Acknowledgments ................................................ xxi Introduction ..................................................... xxiii
Part I Core Markup 1 TraditionalHTMLandXHTML ....................................
3 FirstLookatHTMLandXHTML ...................................
3 HelloHTMLandXHTMLWorld ....................................
6 ViewingMarkupLocally .....................................
8 ViewingMarkupwithaWebServer ........................... 10 HTMLandXHTML:VersionHistory ................................ 14 HTMLandXHTMLDTDs:TheSpecificationsUpClose ................ 16 DocumentTypeStatementsandLanguageVersions ............. 18 (X)HTMLDocumentStructure ...................................... 20 TheDocumentHead ........................................ 23
TheDocumentBody ........................................ 28 Browsersand(X)HTML ............................................ 31 Validation .................................................. 37 TheDoctypeSwitchandBrowserRenderingModes ............. 39
TheRulesof(X)HTML ............................................. 41 HTMLIsNotCaseSensitive,XHTMLIs ....................... 41 AttributeValuesMayBeCaseSensitive ........................ 42 (X)HTMLIsSensitivetoaSingleWhitespaceCharacter .......... 42 (X)HTMLFollowsaContentModel ........................... 43 ElementsShouldHaveCloseTagsUnlessEmpty ................ 43 UnusedElementsMayMinimize .............................. 43 ElementsShouldNest ....................................... 43 AttributesShouldBeQuoted ................................. 44 EntitiesShouldBeUsedforSpecialCharacters .................. 44 BrowsersIgnoreUnknownAttributesandElements ............. 44 MajorThemesof(X)HTML ......................................... 45 LogicalandPhysicalMarkup ................................. 45 Standardsvs.Practice ....................................... 46 MythsandMisconceptionsAboutHTMLandXHTML ........... 47 TheFutureofMarkup—TwoPaths? ................................. 49
XHTML:WebPageMarkupXMLStyle ........................ 49 HTML5:BacktotheFuture ................................... 52 Summary ........................................................ 53
2 IntroducingHTML5 .............................................. 55
HelloHTML5 .................................................... 55 LooseSyntaxReturns .............................................. 58XHTML5 ........................................................ 60 vii
HTML&CSS:TheCompleteReference HTML&CSS:TheCompleteReference
HTML5:EmbracingtheRealityofWebMarkup ....................... 62 PresentationalMarkupRemovedandRedefined ...................... 63 OutwiththeOldElements ................................... 64 InwiththeNewElements .................................... 66 SampleofNewAttributesforHTML5 ......................... 66 HTML5DocumentStructureChanges ............................... 69
AddingSemantics ................................................ 75 MarkingText ............................................... 75 IndicatingDatesandTime ................................... 76 InsertingFigures ............................................ 76 SpecifyingNavigation ....................................... 77 HTML5’sOpenMediaEffort ....................................... 78 <video> ................................................... 78 <audio> ................................................... 80 MediaConsiderations ....................................... 82 Client-SideGraphicswith<canvas> ................................. 82 DrawingandStylingLinesandShapes ........................ 85 DrawingArcsandCurves .................................... 90 Scaling,Rotating,andTranslatingDrawings .................... 93 UsingBitmapsinDrawings .................................. 97 TextSupportforcanvas ...................................... 98 <canvas>Conclusions ....................................... 101
HTML5FormChanges ............................................ 101 NewFormFieldTypes ....................................... 101 ValidatingDataEntry ....................................... 104 AutocompleteLists ......................................... 105 MiscellaneousUsabilityImprovements ........................ 105 EmergingElementsandAttributestoSupportWebApplications ........ 106 menuElementRepurposed .................................. 106 commandElement .......................................... 108 meterandprogressElements ................................. 109 detailsElement ............................................. 109 outputElement ............................................. 110 TheUncertainFutureofFrames .............................. 110 ThedraggableAttributeandtheDragandDropAPI ............ 112 contenteditableAttribute .................................... 114 spellcheckAttribute ......................................... 115 InternationalizationImprovements .................................. 116
HTML5MetadataChanges ......................................... 116 data-XAttributes ........................................... 116 Microdata .................................................. 117 HTML5:BeyondMarkup .......................................... 120 deferAttribute .............................................. 121 HTML,JavaScript,andtheDOMRenewed ..................... 121 StandardizingandExtendingAdHocJavaScriptConventions .... 125 MajorHTML5Themes ............................................. 126 HTML5TodayorTomorrow? ................................. 126 HTML5asaCatch-All ....................................... 130 HTML5:WebPoliticsasUsual ................................ 131 HTML5:ImperfectImprovement .............................. 131
Summary ........................................................ 132
C o n t e n t s 3 HTMLandXHTMLElementReference ............................. 133
FlavorsofHTMLandXHTML ...................................... 133
CoreAttributesReference .......................................... 135
class ....................................................... 136 id ......................................................... 136 style ....................................................... 137 title ....................................................... 138
LanguageAttributesReference ..................................... 138
dir ........................................................ 138 lang ....................................................... 139OtherCommonAttributesReference ................................ 139
accesskey .................................................. 139 align ...................................................... 140 contenteditable ............................................. 140 datafld .................................................... 141 dataformatas ............................................... 141 datasrc .................................................... 141 disabled ................................................... 141 height ..................................................... 141 hidefocus .................................................. 141 hspace ..................................................... 141 language ................................................... 141 tabindex ................................................... 142 unselectable ................................................ 142 vspace ..................................................... 142 width ..................................................... 142CommonHTML5AttributesReference .............................. 142
accesskey .................................................. 142 contenteditable ............................................. 143 contextmenu ............................................... 143 data-X(CustomDataAttributes) .............................. 143 draggable .................................................. 144 hidden .................................................... 144 itemid ..................................................... 144 itemprop .................................................. 144 itemref .................................................... 145 itemscope .................................................. 145 itemtype ................................................... 146 spellcheck .................................................. 146 tabindex ................................................... 146EventAttributesReference ......................................... 146
HTML5Events ............................................. 146 InternetExplorer’sExtendedEventAttributes .................. 147
HTMLElementReference .......................................... 154
<!--...--> (Comment) ...................................... 155 <!--.[]..--> (ConditionalComment) .......................... 155 <!DOCTYPE> (DocumentTypeDefinition) ................... 157 <a> (Anchor) ............................................. 158 <abbr> (Abbreviation) ..................................... 164 <acronym> (Acronym) ..................................... 166HTML&CSS:TheCompleteReference HTML&CSS:TheCompleteReference
<address> (Address) ....................................... 168 <applet> (JavaApplet) ..................................... 169 <area> (ImageMapArea) .................................. 171 <article> (Article) ......................................... 175 <aside> (Aside) ........................................... 176 <audio> (Audio) .......................................... 177 <b> (Bold) ................................................ 179 <base> (BaseURL) ........................................ 181 <basefont> (BaseFont) ..................................... 182 <bdo> (BidirectionalOverride) .............................. 183 <bgsound> (BackgroundSound) ............................ 185 <big> (BigFont) ........................................... 186 <blink> (BlinkingText) ..................................... 187 <blockquote> (BlockQuote) ................................ 188 <body> (DocumentBody) .................................. 190 <br> (LineBreak) .......................................... 193 <button> (FormButton) .................................... 195 <canvas> (CanvasforDrawing) ............................. 198 <caption> (TableCaption) .................................. 208 <center> (CenterAlignment) ................................ 210 <cite> (Citation) ........................................... 211 <code> (CodeListing) ..................................... 213 <col> (TableColumn) ...................................... 214 <colgroup> (TableColumnGroup) .......................... 216 <command> (Command) ................................... 219 <comment> (CommentInformation) ......................... 220 <datalist> (ListofPrefillData) .............................. 220 <dd> (DefinitionDescriptioninaDefinitionList orContentinDetailsorFigure) ............................. 222 <del> (DeletedText) ....................................... 224
<details> (AdditionalDetails) ............................... 227 <dfn> (Definition) ......................................... 228 <dir> (DirectoryList) ...................................... 230 <div> (Division) .......................................... 231 <dl> (DefinitionList) ...................................... 233 <dt> (TerminaDefinitionListor