HTML5 and CSS3: Visual QuickStart Guide, Seventh Edition

HTML5 and CSS3: Visual QuickStart Guide, Seventh Edition

by Elizabeth Castro, Bruce Hyslop
Released December 2011
Publisher(s): Peachpit Press
ISBN: 9780131382022

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Want to learn how to build Web sites fast? This best-selling guide’s visual format and step-by-step, task-based instructions will have you up and running with HTML5 and CSS3 in no time. This Seventh Edition is a major revision, with approximately 125 pages added and substantial updates to (or complete rewrites of) nearly every page from the preceding edition. Authors Elizabeth Castro and Bruce Hyslop use clear instructions, friendly prose, and real-world code samples to teach you HTML and CSS from the ground up. Over the course of 21 chapters you will learn how to:

  • Write semantic HTML, both with elements that have been around for years and ones that are new in HTML5.

  • Prepare images for the Web and add them to your pages.

  • Use CSS to style text, add background colors and images, and implement a multicolumn layout.

  • Build a single site for all users—whether they are using a mobile phone, tablet, laptop, desktop computer, or other Web-enabled device—based on many of the components of responsive Web design, including CSS3 media queries.

  • Leverage new selectors in CSS3, add Web fonts to your pages with @font-face, and use CSS3 effects such as opacity, background alpha transparency, gradients, rounded corners, drop shadows, shadows inside elements, text shadows, and multiple background images.

  • Improve your site’s accessibility with ARIA landmark roles and other good coding practices.

  • Build forms to solicit input from your visitors.

  • Include media in your pages with the HTML5 audio and video elements.

  • Test and debug your Web pages.

  • Secure a domain name and publish your site.

    •  And much more! All book code samples and more are available on the companion web site.

    Table of contents

    1. Title Page
    2. Copyright Page
    3. Dedication
    4. Acknowledgments
    5. Contents at a Glance
    6. Table of Contents
    7. Introduction
      1. HTML and CSS in Brief
      2. Progressive Enhancement: A Best Practice
      3. Is This Book for You?
      4. How This Book Works
      5. Companion Web Site
    8. 1. Web Page Building Blocks
      1. A Basic HTML Page
      2. Semantic HTML: Markup with Meaning
      3. Markup: Elements, Attributes, and Values
      4. A Web Page’s Text Content
      5. Links, Images, and Other Non-Text Content
      6. File Names
      7. URLs
      8. Key Takeaways
    9. 2. Working with Web Page Files
      1. Planning Your Site
      2. Creating a New Web Page
      3. Saving Your Web Page
      4. Specifying a Default Page or Homepage
      5. Editing Web Pages
      6. Organizing Files
      7. Viewing Your Page in a Browser
      8. The Inspiration of Others
    10. 3. Basic HTML Structure
      1. Starting Your Web Page
      2. Creating a Title
      3. Creating Headings
      4. Understanding HTML5’s Document Outline
      5. Grouping Headings
      6. Common Page Constructs
      7. Creating a Header
      8. Marking Navigation
      9. Creating an Article
      10. Defining a Section
      11. Specifying an Aside
      12. Creating a Footer
      13. Creating Generic Containers
      14. Improving Accessibility with ARIA
      15. Naming Elements with a Class or ID
      16. Adding the Title Attribute to Elements
      17. Adding Comments
    11. 4. Text
      1. Starting a New Paragraph
      2. Adding Author Contact Information
      3. Creating a Figure
      4. Specifying Time
      5. Marking Important and Emphasized Text
      6. Indicating a Citation or Reference
      7. Quoting Text
      8. Highlighting Text
      9. Explaining Abbreviations
      10. Defining a Term
      11. Creating Superscripts and Subscripts
      12. Noting Edits and Inaccurate Text
      13. Marking Up Code
      14. Using Preformatted Text
      15. Specifying Fine Print
      16. Creating a Line Break
      17. Creating Spans
      18. Other Elements
    12. 5. Images
      1. About Images for the Web
      2. Getting Images
      3. Choosing an Image Editor
      4. Saving Your Images
      5. Inserting Images on a Page
      6. Offering Alternate Text
      7. Specifying Image Size
      8. Scaling Images with the Browser
      9. Scaling Images with an Image Editor
      10. Adding Icons for Your Web Site
    13. 6. Links
      1. The Anatomy of a Link
      2. Creating a Link to Another Web Page
      3. Creating Anchors
      4. Linking to a Specific Anchor
      5. Creating Other Kinds of Links
    14. 7. CSS Building Blocks
      1. Constructing a Style Rule
      2. Adding Comments to Style Rules
      3. The Cascade: When Rules Collide
      4. A Property’s Value
    15. 8. Working with Style Sheets
      1. Creating an External Style Sheet
      2. Linking to External Style Sheets
      3. Creating an Embedded Style Sheet
      4. Applying Inline Styles
      5. The Importance of Location
      6. Using Media-Specific Style Sheets
      7. Offering Alternate Style Sheets
      8. The Inspiration of Others: CSS
    16. 9. Defining Selectors
      1. Constructing Selectors
      2. Selecting Elements by Name
      3. Selecting Elements by Class or ID
      4. Selecting Elements by Context
      5. Selecting Part of an Element
      6. Selecting Links Based on Their State
      7. Selecting Elements Based on Attributes
      8. Specifying Groups of Elements
      9. Combining Selectors
      10. Selectors Recap
    17. 10. Formatting Text with Styles
      1. Choosing a Font Family
      2. Specifying Alternate Fonts
      3. Creating Italics
      4. Applying Bold Formatting
      5. Setting the Font Size
      6. Setting the Line Height
      7. Setting All Font Values at Once
      8. Setting the Color
      9. Changing the Text’s Background
      10. Controlling Spacing
      11. Adding Indents
      12. Setting White Space Properties
      13. Aligning Text
      14. Changing the Text Case
      15. Using Small Caps
      16. Decorating Text
    18. 11. Layout with Styles
      1. Considerations When Beginning a Layout
      2. Structuring Your Pages
      3. Styling HTML5 Elements in Older Browsers
      4. Resetting or Normalizing Default Styles
      5. The Box Model
      6. Changing the Background
      7. Setting the Height or Width for an Element
      8. Setting the Margins around an Element
      9. Adding Padding around an Element
      10. Making Elements Float
      11. Controlling Where Elements Float
      12. Setting the Border
      13. Offsetting Elements in the Natural Flow
      14. Positioning Elements Absolutely
      15. Positioning Elements in 3D
      16. Determining How to Treat Overflow
      17. Aligning Elements Vertically
      18. Changing the Cursor
      19. Displaying and Hiding Elements
    19. 12. Style Sheets for Mobile to Desktop
      1. Mobile Strategies and Considerations
      2. Understanding and Implementing Media Queries
      3. Building a Page that Adapts with Media Queries
    20. 13. Working with Web Fonts
      1. What Is a Web Font?
      2. Where to Find Web Fonts
      3. Downloading Your First Web Font
      4. Working with @font-face
      5. Styling Web Fonts and Managing File Size
    21. 14. Enhancements with CSS3
      1. Understanding Vendor Prefixes
      2. A Quick Look at Browser Compatibility
      3. Using Polyfills for Progressive Enhancement
      4. Rounding the Corners of Elements
      5. Adding Drop Shadows to Text
      6. Adding Drop Shadows to Other Elements
      7. Applying Multiple Backgrounds
      8. Using Gradient Backgrounds
      9. Setting the Opacity of Elements
    22. 15. Lists
      1. Creating Ordered and Unordered Lists
      2. Choosing Your Markers
      3. Choosing Where to Start List Numbering
      4. Using Custom Markers
      5. Controlling Where Markers Hang
      6. Setting All List-Style Properties at Once
      7. Styling Nested Lists
      8. Creating Description Lists
    23. 16. Forms
      1. Creating Forms
      2. Processing Forms
      3. Sending Form Data via Email
      4. Organizing the Form Elements
      5. Creating Text Boxes
      6. Creating Password Boxes
      7. Creating Email, Telephone, and URL Boxes
      8. Labeling Form Parts
      9. Creating Radio Buttons
      10. Creating Select Boxes
      11. Creating Checkboxes
      12. Creating Text Areas
      13. Allowing Visitors to Upload Files
      14. Creating Hidden Fields
      15. Creating a Submit Button
      16. Using an Image to Submit a Form
      17. Disabling Form Elements
      18. New HTML5 Features and Browser Support
    24. 17. Video, Audio, and Other Multimedia
      1. Third-Party Plugins and Going Native
      2. Video File Formats
      3. Adding a Single Video to Your Web Page
      4. Exploring Video Attributes
      5. Adding Controls and Autoplay to Your Video
      6. Looping a Video and Specifying a Poster Image
      7. Preventing a Video from Preloading
      8. Using Video with Multiple Sources
      9. Multiple Media Sources and the Source Element
      10. Adding Video with Hyperlink Fallbacks
      11. Adding Video with Flash Fallbacks
      12. Providing Accessibility
      13. Adding Audio File Formats
      14. Adding a Single Audio File to Your Web Page
      15. Adding a Single Audio File with Controls to Your Web Page
      16. Exploring Audio Attributes
      17. Adding Controls and Autoplay to Audio in a Loop
      18. Preloading an Audio File
      19. Providing Multiple Audio Sources
      20. Adding Audio with Hyperlink Fallbacks
      21. Adding Audio with Flash Fallbacks
      22. Adding Audio with Flash and a Hyperlink Fallback
      23. Getting Multimedia Files
      24. Considering Digital Rights Management (DRM)
      25. Embedding Flash Animation
      26. Embedding YouTube Video
      27. Using Video with Canvas
      28. Coupling Video with SVG
      29. Further Resources
    25. 18. Tables
      1. Structuring Tables
      2. Spanning Columns and Rows
    26. 19. Working with Scripts
      1. Loading an External Script
      2. Adding an Embedded Script
      3. JavaScript Events
    27. 20. Testing & Debugging Web Pages
      1. Trying Some Debugging Techniques
      2. Checking the Easy Stuff: General
      3. Checking the Easy Stuff: HTML
      4. Checking the Easy Stuff: CSS
      5. Validating Your Code
      6. Testing Your Page
      7. When Images Don’t Appear
      8. Still Stuck?
    28. 21. Publishing Your Pages on the Web
      1. Getting Your Own Domain Name
      2. Finding a Host for Your Site
      3. Transferring Files to the Server
    29. A. HTML Reference
    30. B. CSS Properties and Values
      1. CSS Properties and Values
      2. CSS Selectors
      3. CSS Color Values
      4. Gradients
      5. Media Queries
      6. CSS Font Embedding
    31. Index

    Product information

    • Title: HTML5 and CSS3: Visual QuickStart Guide, Seventh Edition
    • Author(s): Elizabeth Castro, Bruce Hyslop
    • Release date: December 2011
    • Publisher(s): Peachpit Press
    • ISBN: 9780131382022