HTML And CSS - Pearsoncmg

Transcription

V I S U AL QUI C K START G UID EHTML and CSSEighth EditionLARRY ULLMANELIZABETH CASTROBRUCE HYSLOPL E A R N T H E Q U I C K A N D E A S Y WAY !

V I S UA L Q U I C K s ta r t G U I D EHTMLand CSSEighth EditionElizabeth Castro  Bruce HyslopPeachpit Press

Visual QuickStart GuideHTML and CSS, Eighth EditionElizabeth Castro and Bruce HyslopPeachpit Presswww.peachpit.comTo report errors, please send a note to errata@peachpit.com.Peachpit Press is a division of Pearson Education.Copyright 2014 by Elizabeth Castro and Bruce HyslopEditor: Clifford ColbyDevelopment editor: Robyn G. ThomasProduction editor: David Van NessCopyeditor: Scout FestaTechnical editor: Aubrey TaylorCompositor: David Van NessIndexer: Valerie Haynes PerryCover design: RHDG / Riezebos Holzbaur Design Group, Peachpit PressInterior design: Peachpit PressLogo design: MINE www.minesf.comNotice of RightsAll rights reserved. No part of this book may be reproduced or transmitted in any form by any means, electronic,mechanical, photocopying, recording, or otherwise, without the prior written permission of the publisher.For information on getting permission for reprints and excerpts, contact permissions@peachpit.com.css3generator.com screen shot courtesy of Randy Jensen.css3please.com screen shot courtesy of Paul Irish.dribbble.com screen shots courtesy of Dan Cederholm.fontsquirrel.com screen shots courtesy of Ethan Dunham.foodsense.is screen shots courtesy of Julie Lamba.google.com/fonts screen shots courtesy of Google.namecheap.com screen shots courtesy of Namecheap.Silk icon set courtesy of Mark James co font courtesy of Fontfabric (www.fontfabric.com).Notice of LiabilityThe information in this book is distributed on an “As Is” basis, without warranty. While every precaution has been takenin the preparation of the book, neither the authors nor the publisher shall have any liability to any person or entity withrespect to any loss or damage caused or alleged to be caused directly or indirectly by the instructions contained in thisbook or by the computer software and hardware products described in it.TrademarksVisual QuickStart Guide is a registered trademark of Peachpit Press, a division of Pearson Education.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 Peachpit was aware of a trademark claim, the designations appearas requested by the owner of the trademark. All other product names and services identified throughout this book areused in editorial fashion only and for the benefit of such companies with no intention of infringement of the trademark.No such use, or the use of any trade name, is intended to convey endorsement or other affiliation with this book.ISBN-13: 978-0-321-92883-2ISBN-10:0-321-92883-09 8 7 6 5 4 3 2 1Printed and bound in the United States of America

DedicationTo family.To those I know who endured difficult challenges, demonstrating courage and perseverance all the way.

AcknowledgmentsOne of my favorite parts of working on thisbook has been the people I’ve been able towork with. All are dedicated, professional,good-natured, and good-humored folks whomade it a real pleasure. The book wouldn’tbe the same without their contributions.A grateful, sincere thank you goes out to:Nancy Aldrich-Ruenzel and Nancy Davis, fortheir continued trust in me.Cliff Colby, for his support, for bringing theteam together, and for keeping things light.Robyn Thomas, for making the enginego, improving copy, tracking all thedetails, being flexible, and providingencouragement.Scout Festa, for her skill in simplifying language, for her watchful eye, and for helpingto keep things consistent and polished.Aubrey Taylor, for all the great suggestionsand technical feedback. They were veryhelpful, and readers are better off for them.David Van Ness, for leading the charge inmaking it all look great and for all his effortsin refining the layouts.Valerie Haynes Perry, for compiling theall-important index, which will be the firstdestination for many readers in search ofinformation.The marketing, sales, and other folks atPeachpit, for working hard to make the bookavailable to readers.Scott Boms, Ian Devlin, Seth Lemoine, ErikVorhes, and Brian Warren, for their contributions to the previous edition.Victor Gavenda, for providing access tonecessary software.Dan Cederholm, Ethan Dunham, Paul Irish,Mark James, Randy Jensen, Julie Lamba,Fontfabric, Google, and Namecheap, forallowing me to use screen shots or designassets (as the case may be).C.R. Freer, for working her camera magic.My family and friends, for providing inspiration and breaks, for being patient, and fornot disowning me while I was holed up writing for months.Robert Reinhardt, as always, for getting mestarted in writing books and for having aswell beard.The Boston Bruins, for providing a lot ofplayoffs thrills during my infrequent breaks.The numerous folks in the web communitywho have shared their expertise and experiences for the betterment of others. (I’vecited many of you throughout the book.)To you readers, for inspiring me to recallwhen I began learning HTML and CSS sothat I may explain them in ways I hope youfind helpful. Thank you for choosing thisbook as part of your journey in contributingto the web. Happy reading!Natalia Ammon, for the wonderful designof the example webpage that adorns thepages of Chapters 11 and 12, and otherspots. You can see more of her work atwww.nataliaammon.com.And, lastly, I would like to give a specialthank you to Elizabeth Castro, who createdthis title in the 1990s. She has taught countless readers how to build webpages overmany editions and many years. Because theweb has given me so much, I’m genuinelyappreciative of the opportunity to teachreaders via this title as well.Zach Szukala, for recommending Natalia.—BruceivAcknowledgments

Contents at a GlanceIntroduction . . . . . . . . . . . . . . . . . . . . . . . . . xvChapter 1Webpage Building Blocks . . . . . . . . . . . . . . . . 1Chapter 2Working with Webpage Files . . . . . . . . . . . . . 27Chapter 3Basic HTML Structure . . . . . . . . . . . . . . . . . . 43Chapter 4Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87Chapter 5Images . . . . . . . . . . . . . . . . . . . . . . . . . . . 133Chapter 6Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157Chapter 7CSS Building Blocks . . . . . . . . . . . . . . . . . . . 169Chapter 8Working with Style Sheets . . . . . . . . . . . . . . 189Chapter 9Defining Selectors . . . . . . . . . . . . . . . . . . . . 203Chapter 10Formatting Text with Styles . . . . . . . . . . . . . . 229Chapter 11Layout with Styles . . . . . . . . . . . . . . . . . . . . 265Chapter 12Building Responsive Webpages . . . . . . . . . . . 309Chapter 13Working with Web Fonts . . . . . . . . . . . . . . . 335Chapter 14Enhancements and Effects with CSS . . . . . . . . 361Chapter 15Lists . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389Chapter 16Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . 409Chapter 17Video, Audio, and Other Multimedia . . . . . . . . 449Chapter 18Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477Chapter 19Adding JavaScript . . . . . . . . . . . . . . . . . . . . 485Chapter 20Testing & Debugging Webpages . . . . . . . . . . 495Chapter 21Publishing Your Pages on the Web . . . . . . . . . 511AppendixHTML Reference . . . . . . . . . . . . . . . . . . . . . 519Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . 533Contents at a Glancev

This page intentionally left blank

Table of ContentsIntroduction . . . . . . . . . . . . . . . . . . . . . . . . . xvHTML and CSS in Brief . . . . . . . . . . . . . . . . . . . xviWeb Browsers . . . . . . . . . . . . . . . . . . . . . . . . xviiWeb Standards and Specifications . . . . . . . . . . . . xviiiProgressive Enhancement: A Best Practice . . . . . . . . xxIs This Book for You? . . . . . . . . . . . . . . . . . . . . xxiiHow This Book Works . . . . . . . . . . . . . . . . . . . xxivCompanion Website . . . . . . . . . . . . . . . . . . . . xxviChapter 1Webpage Building Blocks . . . . . . . . . . . . . . . . . 1Thinking in HTML . . . . . . . . . . . . . . . . . . . . . . . 3A Basic HTML Page . . . . . . . . . . . . . . . . . . . . . . 4Markup: Elements, Attributes, Values, and More . . . . . 8A Webpage’s Text Content . . . . . . . . . . . . . . . . . 12Links, Images, and Other Non-Text Content . . . . . . . 13File and Folder Names . . . . . . . . . . . . . . . . . . . 14URLs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15HTML: Markup with Meaning . . . . . . . . . . . . . . . . 20A Browser’s Default Display of Webpages . . . . . . . . .24Key Takeaways . . . . . . . . . . . . . . . . . . . . . . . . 26Chapter 2Working with Webpage Files . . . . . . . . . . . . . . 27Planning Your Site . . . . . . . . . . . . . . . . . . . . . . 28Creating a New Webpage . . . . . . . . . . . . . . . . . 30Saving Your Webpage . . . . . . . . . . . . . . . . . . . 32Specifying a Default Page or Homepage . . . . . . . . . 35Editing Webpages . . . . . . . . . . . . . . . . . . . . . . 36Organizing Files . . . . . . . . . . . . . . . . . . . . . . . .37Viewing Your Page in a Browser . . . . . . . . . . . . . . 38The Inspiration of Others . . . . . . . . . . . . . . . . . . 40Chapter 3Basic HTML Structure . . . . . . . . . . . . . . . . . . . 43Starting Your Webpage . . . . . . . . . . . . . . . . . . . 44Creating a Title . . . . . . . . . . . . . . . . . . . . . . . . 48Table of Contentsvii

Creating Headings . . . . . . . . . . . . . . . . . . . . . 50Common Page Constructs . . . . . . . . . . . . . . . . . 53Creating a Header . . . . . . . . . . . . . . . . . . . . . . 54Marking Navigation . . . . . . . . . . . . . . . . . . . . . 56Marking the Main Area of a Webpage . . . . . . . . . . . 59Creating an Article . . . . . . . . . . . . . . . . . . . . . 60Defining a Section . . . . . . . . . . . . . . . . . . . . . . 63Specifying an Aside . . . . . . . . . . . . . . . . . . . . . 65Creating a Footer . . . . . . . . . . . . . . . . . . . . . . .70Creating Generic Containers . . . . . . . . . . . . . . . . 73Improving Accessibility with ARIA . . . . . . . . . . . . . 78Naming Elements with a Class or ID . . . . . . . . . . . . 82Adding the Title Attribute to Elements . . . . . . . . . . 84Adding Comments . . . . . . . . . . . . . . . . . . . . . 85Chapter 4Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87Adding a Paragraph . . . . . . . . . . . . . . . . . . . . . 88Specifying Fine Print . . . . . . . . . . . . . . . . . . . . 89Marking Important and Emphasized Text . . . . . . . . . 90Creating a Figure . . . . . . . . . . . . . . . . . . . . . . 92Indicating a Citation or Reference . . . . . . . . . . . . . 94Quoting Text . . . . . . . . . . . . . . . . . . . . . . . . . 95Specifying Time . . . . . . . . . . . . . . . . . . . . . . . 98Explaining Abbreviations . . . . . . . . . . . . . . . . . . 101Defining a Term . . . . . . . . . . . . . . . . . . . . . . . 103Creating Superscripts and Subscripts . . . . . . . . . . 104Adding Author Contact Information . . . . . . . . . . . 106Noting Edits and Inaccurate Text . . . . . . . . . . . . . 108Marking Up Code . . . . . . . . . . . . . . . . . . . . . . 112Using Preformatted Text . . . . . . . . . . . . . . . . . . 114Highlighting Text . . . . . . . . . . . . . . . . . . . . . . 116Creating a Line Break . . . . . . . . . . . . . . . . . . . . 118Creating Spans . . . . . . . . . . . . . . . . . . . . . . . 120Other Elements . . . . . . . . . . . . . . . . . . . . . . . 122Chapter 5Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133Images for the Web . . . . . . . . . . . . . . . . . . . . . 134Getting Images . . . . . . . . . . . . . . . . . . . . . . . 140Choosing an Image Editor . . . . . . . . . . . . . . . . . 141Saving Your Images . . . . . . . . . . . . . . . . . . . . 142Inserting Images on a Page . . . . . . . . . . . . . . . . 145viiiTable of Contents

Offering Alternative Text . . . . . . . . . . . . . . . . . . 147Specifying Image Sizes . . . . . . . . . . . . . . . . . . 149Scaling Images with the Browser . . . . . . . . . . . . . 152Scaling Images with an Image Editor . . . . . . . . . . . 154Adding Icons for Your Website . . . . . . . . . . . . . . 155Chapter 6Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157Creating a Link to Another Webpage(and Other Link Basics) . . . . . . . . . . . . . . . . . 158Creating and Linking to Anchors . . . . . . . . . . . . . 164Creating Other Kinds of Links . . . . . . . . . . . . . . . 166Chapter 7CSS Building Blocks . . . . . . . . . . . . . . . . . . . . 169Constructing a Style Rule . . . . . . . . . . . . . . . . . . 171Adding Comments to Style Rules . . . . . . . . . . . . . 172Understanding Inheritance . . . . . . . . . . . . . . . . . 174The Cascade: When Rules Collide . . . . . . . . . . . . 177A Property’s Value . . . . . . . . . . . . . . . . . . . . . 180Chapter 8Working with Style Sheets . . . . . . . . . . . . . . . 189Creating an External Style Sheet . . . . . . . . . . . . . 190Linking to External Style Sheets . . . . . . . . . . . . . 192Creating an Embedded Style Sheet . . . . . . . . . . . 194Applying Inline Styles . . . . . . . . . . . . . . . . . . . 196The Cascade and the Order of Styles . . . . . . . . . . 198Using Media-Specific Style Sheets . . . . . . . . . . . .200The Inspiration of Others: CSS . . . . . . . . . . . . . . 202Chapter 9Defining Selectors . . . . . . . . . . . . . . . . . . . . 203Constructing Selectors . . . . . . . . . . . . . . . . . . . 204Selecting Elements by Name . . . . . . . . . . . . . . .206Selecting Elements by Class or ID . . . . . . . . . . . . 208Selecting Elements by Context . . . . . . . . . . . . . . 212Selecting an Element That Is the First or Last Child . . 216Selecting the First Letter or First Line of an Element . . 218Selecting Links Based on Their State . . . . . . . . . . 220Selecting Elements Based on Attributes . . . . . . . . . 222Specifying Groups of Elements . . . . . . . . . . . . . . 226Combining Selectors . . . . . . . . . . . . . . . . . . . . 227Table of Contentsix

Chapter 10Formatting Text with Styles . . . . . . . . . . . . . . 229Before and After . . . . . . . . . . . . . . . . . . . . . . 230Choosing a Font Family . . . . . . . . . . . . . . . . . . 232Specifying Alternate Fonts . . . . . . . . . . . . . . . . 233Creating Italics . . . . . . . . . . . . . . . . . . . . . . . 236Applying Bold Formatting . . . . . . . . . . . . . . . . . 238Setting the Font Size . . . . . . . . . . . . . . . . . . . . 240Setting the Line Height . . . . . . . . . . . . . . . . . . . 245Setting All Font Values at Once . . . . . . . . . . . . . . 246Setting the Color . . . . . . . . . . . . . . . . . . . . . . 248Setting the Background . . . . . . . . . . . . . . . . . . 250Controlling Spacing . . . . . . . . . . . . . . . . . . . . . 257Adding Indents . . . . . . . . . . . . . . . . . . . . . . . 258Aligning Text . . . . . . . . . . . . . . . . . . . . . . . . 259Changing the Text Case . . . . . . . . . . . . . . . . . .260Using Small Caps . . . . . . . . . . . . . . . . . . . . . . 261Decorating Text . . . . . . . . . . . . . . . . . . . . . . . 262Setting Whitespace Properties . . . . . . . . . . . . . . 264Chapter 11Layout with Styles . . . . . . . . . . . . . . . . . . . . 265Considerations When Beginning a Layout . . . . . . . . 266Structuring Your Pages . . . . . . . . . . . . . . . . . . . 268Styling HTML5 Elements in Older Browsers . . . . . . . 272Resetting or Normalizing Default Styles . . . . . . . . . 274The Box Model . . . . . . . . . . . . . . . . . . . . . . . 276Controlling the Display Type and Visibilityof Elements . . . . . . . . . . . . . . . . . . . . . . . . 278Setting the Height or Width for an Element . . . . . . . 282Adding Padding Around an Element . . . . . . . . . . . 286Setting the Border . . . . . . . . . . . . . . . . . . . . . 288Setting the Margins Around an Element . . . . . . . . . 292Making Elements Float . . . . . . . . . . . . . . . . . . . 295Controlling Where Elements Float . . . . . . . . . . . . 297Positioning Elements Relatively . . . . . . . . . . . . . . 301Positioning Elements Absolutely . . . . . . . . . . . . . 302Positioning Elements in a Stack . . . . . . . . . . . . . . 304Determining How to Treat Overflow . . . . . . . . . . . 305Aligning Elements Vertically . . . . . . . . . . . . . . . .306Changing the Cursor . . . . . . . . . . . . . . . . . . . .308xTable of Contents

Chapter 12Building Responsive Webpages . . . . . . . . . . . 309Responsive Web Design: An Overview . . . . . . . . . 310Making Images Flexible . . . . . . . . . . . . . . . . . . 312Creating a Flexible Layout Grid . . . . . . . . . . . . . . 315Understanding and Implementing Media Queries . . . 319Putting It All Together . . . . . . . . . . . . . . . . . . . 326Accommodating Older Versions ofInternet Explorer . . . . . . . . . . . . . . . . . . . . . 333Chapter 13Working with Web Fonts . . . . . . . . . . . . . . . . 335What Is a Web Font? . . . . . . . . . . . . . . . . . . . . 336Where to Find Web Fonts . . . . . . . . . . . . . . . . . 338Downloading Your First Web Font . . . . . . . . . . . . 342Understanding the @font-face Rule . . . . . . . . . . . 345Styling Text with a Web Font . . . . . . . . . . . . . . . 346Applying Italics and Bold with a Web Font . . . . . . . . 349Using Web Fonts from Google Fonts . . . . . . . . . . . 357Chapter 14Enhancements and Effects with CSS . . . . . . . . 361Browser Compatibility, Progressive Enhancement,and Polyfills . . . . . . . . . . . . . . . . . . . . . . . . 362Understanding Vendor Prefixes . . . . . . . . . . . . . . 364Rounding the Corners of Elements . . . . . . . . . . . . 365Adding Drop Shadows to Text . . . . . . . . . . . . . . . 368Adding Drop Shadows to Elements . . . . . . . . . . . . 370Applying Multiple Backgrounds . . . . . . . . . . . . . . 373Using Gradient Backgrounds . . . . . . . . . . . . . . . 376Setting the Opacity of Elements . . . . . . . . . . . . . 382Effects with Generated Content . . . . . . . . . . . . . 384Combining Images with Sprites . . . . . . . . . . . . . . 387Chapter 15Lists . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389Creating Ordered and Unordered Lists . . . . . . . . . 390Choosing Your Markers . . . . . . . . . . . . . . . . . . 393Using Custom Markers . . . . . . . . . . . . . . . . . . . 394Choosing Where to Start List Numbering . . . . . . . . 397Controlling Where Markers Hang . . . . . . . . . . . . . 398Setting All List-Style Properties at Once . . . . . . . . . 399Styling Nested Lists . . . . . . . . . . . . . . . . . . . . 400Creating Description Lists . . . . . . . . . . . . . . . . . 404Table of Contentsxi

Chapter 16Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . 409Improvements to Forms in HTML5 . . . . . . . . . . . . 410Creating Forms . . . . . . . . . . . . . . . . . . . . . . . 413Processing Forms . . . . . . . . . . . . . . . . . . . . . . 416Organizing the Form Elements . . . . . . . . . . . . . . 418Creating Text Boxes . . . . . . . . . . . . . . . . . . . . 422Labeling Form Parts . . . . . . . . . . . . . . . . . . . . 425Creating Password Boxes . . . . . . . . . . . . . . . . . 427Creating Email, Search, Telephone, andURL Boxes . . . . . . . . . . . . . . . . . . . . . . . . 428Creating Radio Buttons . . . . . . . . . . . . . . . . . . 432Creating Checkboxes . . . . . . . . . . . . . . . . . . . 434Creating Text Areas . . . . . . . . . . . . . . . . . . . . 436Creating Select Boxes . . . . . . . . . . . . . . . . . . 437Allowing Visitors to Upload Files . . . . . . . . . . . . . 439Creating Hidden Fields . . . . . . . . . . . . . . . . . . . 440Creating a Submit Button . . . . . . . . . . . . . . . . . 441Disabling Form Elements . . . . . . . . . . . . . . . . . 444Styling Forms Based on Their State . . . . . . . . . . . 446Chapter 17Video, Audio, and Other Multimedia . . . . . . . . 449Third-Party Plugins and Going Native . . . . . . . . . . 450Video File Formats . . . . . . . . . . . . . . . . . . . . . 451Adding a Video to Your Webpage . . . . . . . . . . . . 452Adding Controls and Autoplay to Your Video . . . . . . 454Looping a Video and Specifying a Poster Image . . . . 456Preventing a Video from Preloading . . . . . . . . . . . 457Using Video with Multiple Sources anda Text Fallback . . . . . . . . . . . . . . . . . . . . . . 459Providing Accessibility . . . . . . . . . . . . . . . . . . . 462Audio File Formats . . . . . . . . . . . . . . . . . . . . . 463Adding an Audio File with Controls toYour Webpage . . . . . . . . . . . . . . . . . . . . . . 464Autoplaying, Looping, and Preloading Audio . . . . . . 466Providing Multiple Audio Sources with a Fallback . . . 468Adding Video and Audio with a Flash Fallback . . . . . 470Advanced Multimedia . . . . . . . . . . . . . . . . . . . 475Further Resources . . . . . . . . . . . . . . . . . . . . . 476xiiTable of Contents

Chapter 18Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477Structuring Tables . . . . . . . . . . . . . . . . . . . . . 478Spanning Columns and Rows . . . . . . . . . . . . . . . 482Chapter 19Adding JavaScript . . . . . . . . . . . . . . . . . . . . 485Loading an External Script . . . . . . . . . . . . . . . . . 487Adding an Embedded Script . . . . . . . . . . . . . . . . 492JavaScript Events . . . . . . . . . . . . . . . . . . . . . . 493Chapter 20Testing & Debugging Webpages . . . . . . . . . . 495Validating Your Code . . . . . . . . . . . . . . . . . . . . 496Testing Your Pages . . . . . . . . . . . . . . . . . . . . . 498Trying Some Debugging Techniques . . . . . . . . . . .502Checking the Easy Stuff: General . . . . . . . . . . . . .504Checking the Easy Stuff: HTML . . . . . . . . . . . . . .506Checking the Easy Stuff: CSS . . . . . . . . . . . . . . .508When Images Don’t Display . . . . . . . . . . . . . . . . 510Chapter 21Publishing Your Pages on the Web . . . . . . . . . . 511Getting Your Own Domain Name . . . . . . . . . . . . . 512Finding a Host for Your Site . . . . . . . . . . . . . . . . 513Transferring Files to the Server . . . . . . . . . . . . . . 515AppendixHTML Reference . . . . . . . . . . . . . . . . . . . . . . 519Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 533Table of Contentsxiii

This page intentionally left blank

IntroductionWhether you are just beginning yourventure into building websites or have builtsome before but want to ensure that yourknowledge is current, you’ve come alongat a very exciting time.in between and on any web-enableddevice. In short, the web’s promise lies inits universality. And its reach c ontinues toexpand as technology finds its way to communities that were once shut out.How we code and style webpages, thebrowsers in which we view the pages, andthe devices on which we visit the web haveall advanced substantially the past fewyears. Once limited to browsing the webfrom our desktop computers or laptops,we can now take the web with us on anynumber of devices: phones, tablets, and,yes, laptops and desktops.Better still, the web belongs to everyone,and anyone is free to create and launcha site. This book shows you how. It isideal for the beginner with no knowledgeof HTML or CSS who wants to beginto create webpages. You’ll find clear,easy-to-follow instructions that take youthrough the process of creating pagesstep by step. And the book is a helpfulguide to keep handy. You can look uptopics in the table of contents or index andconsult just those subjects about whichyou need more information.Which is as it should be, because theweb’s promise has always been the dissolution of boundaries—the power toshare and access information from anymetropolis, rural community, or anywhereIntroductionxv

HTML and CSS in BriefAt the root of the web’s success is asimple, text-based markup language thatis easy to learn and that any device with abasic web browser can read: HTML. Everywebpage requires at least some HTML; itwouldn’t be a webpage without it.As you will learn in greater detail as youread this book, HTML is used to defineyour content, and CSS is used to controlhow your content and webpage will look.Both HTML pages and CSS files (stylesheets) are text files, making them easyto edit. You can see snippets of HTML andCSS in “How This Book Works,” near theend of this introduction.You’ll dive into learning a basic HTML pageright off the bat in Chapter 1, and you’llbegin to learn how to style your pages withCSS in Chapter 7. See “What this book willteach you” later in this introduction for anoverview of the chapters and a summary ofthe primary topics covered.The word HTML is all encompassing, representing the language in general. HTML5is used when referring to that specificversion of HTML, such as when discussinga feature that is new in HTML5 and doesn’texist in previous versions. The sameapproach applies to usage of the termsCSS (general) and CSS3 (specific to CSS3).HTML and HTML5It helps to know some basics about theorigins of HTML to understand HTML5.HTML began in the early 1990s as a shortdocument that detailed a handful of elements used to build webpages. Many ofthose elements were for content such asheadings, paragraphs, lists, and links toother pages. HTML’s version number hasincreased as the language has evolvedxviIntroductionwith the introduction of other elements andadjustments to its rules. The most currentversion is HTML5.HTML5 is a natural evolution of earl

Visual QuickStart Guide HTML and CSS, Eighth Edition Elizabeth Castro and Bruce Hyslop Peachpit Press www.peachpit.com To