You are previewing HTML and CSS in 24 Hours, Sams Teach Yourself (Updated for HTML5 and CSS3), Ninth Edition.
O'Reilly logo
HTML and CSS in 24 Hours, Sams Teach Yourself (Updated for HTML5 and CSS3), Ninth Edition

Book Description

Learn HTML5 and CSS3 in 24 one-hour lessons!

Sams Teach Yourself HTML and CSS in 24 Hours is a well-organized, clearly written, and generously illustrated tutorial that teaches beginners how to quickly create great-looking web pages using HTML5 and CSS3.

With a practical, jargon-free focus on quickly getting web pages created and published to the web, the book's 24 one-hour lessons carefully guide the reader through each step involved in creating, enhancing, and maintaining web sites of all types and sizes.

The ninth edition of Sams Teach Yourself HTML and CSS in 24 Hours brings the entire book in line with the HTML5 and CSS3 specifications and capabilities and includes fresh material and examples that take full advantage of the book's full-color layout and design.

Anyone who completes the lessons in this book can have his or her web pages be among those that appear on the Internet. In fact, within the first two lessons in this book, someone with no previous HTML experience at all can have a web page ready to go online.

If you like learning by doing, this is the book for you. It organizes lessons in the basics of HTML5 and CSS3 into simple steps and then shows you exactly how to tackle each step. Many of these HTML code examples are accompanied by pictures of the output produced by the code. You see how it's done, you read a clear, concise explanation of how it works, and then you immediately do the same thing with your own page. A few minutes later, you're on to the next step.

Learn how to…

  • Build your own web page and get it online in an instant

  • Format text for maximum clarity and readability

  • Create links to other pages and to other sites

  • Add graphics, color, and visual pizzazz to your web pages

  • Work with transparent images and background graphics

  • Design your site’s layout and typography using CSS

  • Get user input with web-based forms

  • Publicize your site and make it search-engine friendly

  • Test a website for compatibility with different browsers

  • Make your site easy to maintain and update as it grows

  • Use HTML5 semantic tags to better structure your pages

  • Create columns with CSS

  • Add HTML5-based video and audio to your site

  • Use CSS3 transforms, transitions, and animations to create great visual effects

  • Use HTML5’s powerful form validation capability

  • Contents at a Glance

    Part I: Getting Started on the Web
    1 Understanding How the Web Works
    2 Structuring an HTML Document
    3 Understanding Cascading Style Sheets

    Part II: Building Blocks of HTML
    4 A Closer Look at HTML5 Page Structure
    5 Working with Text Blocks and Lists
    6 Working with Fonts
    7 Working with Colors and Borders
    8 Using External and Internal Links
    9 Using Tables and Columns
    10 Creating Images for Use on the Web
    11 Using Images in Your Web Site
    12 Using Multimedia in Your Web Site

    Part III: Advanced Web Page Design with CSS
    13 Working with Margins, Padding, Alignment, and Floating
    14 Understanding the CSS Box Model and Positioning
    15 Creating Fixed or Liquid Layouts
    16 Using CSS to Do More with Lists
    17 Using CSS to Design Navigation
    18 Using Mouse Actions to Modify Text Display
    19 Implementing CSS3 Transforms, Transitions, and Animations

    PART IV: Advanced Web Site Functionality and Management
    20 Creating Print-Friendly Web Pages
    21 Understanding Dynamic Web Sites and HTML5 Applications
    22 Working with Web-Based Forms
    23 Organizing and Managing a Web Site
    24 Helping People Find Your Web Pages



    Table of Contents

    1. About This eBook
    2. Title Page
    3. Copyright Page
    4. Table of Contents
    5. About the Author
    6. We Want to Hear from You!
    7. Reader Services
    8. Introduction
      1. Beyond HTML
      2. Visual Examples
      3. Special Elements
      4. Q&A, Quiz, and Exercises
    9. Part I: Getting Started on the Web
      1. Hour 1. Understanding How the Web Works
        1. A Brief History of HTML and the World Wide Web
        2. Creating Web Content
        3. Understanding Web Content Delivery
        4. Selecting a Web Hosting Provider
        5. Testing with Multiple Web Browsers
        6. Creating a Sample File
        7. Using FTP to Transfer Files
        8. Understanding Where to Place Files on the Web Server
        9. Distributing Content Without a Web Server
        10. Tips for Testing Web Content
        11. Summary
        12. Q&A
        13. Workshop
      2. Hour 2. Structuring an HTML Document
        1. Getting Prepared
        2. Getting Started with a Simple Web Page
        3. HTML Tags Every Web Page Must Have
        4. Organizing a Page with Paragraphs and Line Breaks
        5. Organizing Your Content with Headings
        6. Understanding Semantic Elements
        7. Validating Your Web Content
        8. Summary
        9. Q&A
        10. Workshop
      3. Hour 3. Understanding Cascading Style Sheets
        1. How CSS Works
        2. A Basic Stylesheet
        3. A CSS Style Primer
        4. Using Style Classes
        5. Using Style IDs
        6. Internal Stylesheets and Inline Styles
        7. Summary
        8. Q&A
        9. Workshop
    10. Part II: Building Blocks of Practical Web Design
      1. Hour 4. A Closer Look at HTML5 Page Structure
        1. Conceptualizing the Page
        2. Using <header> in Multiple Ways
        3. Understanding the <section> Element
        4. Using <article>
        5. Implementing the <nav> Element
        6. When to Use <aside>
        7. Using <footer> Effectively
        8. Summary
        9. Q&A
        10. Workshop
      2. Hour 5. Working with Text Blocks and Lists
        1. Aligning Text on a Page
        2. The Three Types of HTML Lists
        3. Placing Lists Within Lists
        4. Summary
        5. Q&A
        6. Workshop
        7. Exercises
      3. Hour 6. Working with Fonts
        1. Working with Special Characters
        2. Boldface, Italics, and Special Text Formatting
        3. Tweaking the Font
        4. Using Web Fonts
        5. Summary
        6. Q&A
        7. Workshop
      4. Hour 7. Working with Colors and Borders
        1. Best Practices for Choosing Colors
        2. Understanding Web Colors
        3. Using Hexadecimal Values for Colors
        4. Using CSS to Set Background, Text, and Border Colors
        5. Creating Rounded Corners
        6. Summary
        7. Q&A
        8. Workshop
      5. Hour 8. Using External and Internal Links
        1. Using Web Addresses
        2. Linking Within a Page Using Anchors
        3. Linking Between Your Own Web Content
        4. Linking to External Web Content
        5. Linking to an Email Address
        6. Opening a Link in a New Browser Window
        7. Using CSS to Style Hyperlinks
        8. Summary
        9. Q&A
        10. Workshop
      6. Hour 9. Using Tables and Columns
        1. Creating a Simple Table
        2. Controlling Table Sizes
        3. Alignment and Spanning Within Tables
        4. Page Layout with Tables
        5. Using CSS Columns
        6. Summary
        7. Q&A
        8. Workshop
      7. Hour 10. Creating Images for Use on the Web
        1. Choosing Graphics Software
        2. The Least You Need to Know About Graphics
        3. Preparing Photographic Images
        4. Creating Banners and Buttons
        5. Reducing or Removing Colors in an Image
        6. Creating Tiled Background Images
        7. Creating Animated Web Graphics
        8. Summary
        9. Q&A
        10. Workshop
      8. Hour 11. Using Images in Your Website
        1. Placing Images on a Web Page
        2. Describing Images with Text
        3. Specifying Image Height and Width
        4. Aligning Images
        5. Turning Images into Links
        6. Using Background Images
        7. Using Imagemaps
        8. Summary
        9. Q&A
        10. Workshop
      9. Hour 12. Using Multimedia in Your Website
        1. Linking to Multimedia Files
        2. Embedding Multimedia Files
        3. Using Pure HTML5 for Audio and Video Playback
        4. Additional Tips for Using Multimedia
        5. Summary
        6. Q&A
        7. Workshop
    11. Part III: Advanced Web Page Design with CSS
      1. Hour 13. Working with Margins, Padding, Alignment, and Floating
        1. Using Margins
        2. Padding Elements
        3. Keeping Everything Aligned
        4. Understanding the Float Property
        5. Summary
        6. Q&A
        7. Workshop
      2. Hour 14. Understanding the CSS Box Model and Positioning
        1. The CSS Box Model
        2. The Whole Scoop on Positioning
        3. Controlling the Way Things Stack Up
        4. Managing the Flow of Text
        5. Summary
        6. Q&A
        7. Workshop
      3. Hour 15. Creating Fixed or Liquid Layouts
        1. Understanding Fixed Layouts
        2. Understanding Liquid Layouts
        3. Creating a Fixed/Liquid Hybrid Layout
        4. Considering a Responsive Web Design
        5. Summary
        6. Q&A
        7. Workshop
      4. Hour 16. Using CSS to Do More with Lists
        1. HTML List Refresher
        2. How the CSS Box Model Affects Lists
        3. Placing List Item Indicators
        4. Creating Image Maps with List Items and CSS
        5. Summary
        6. Q&A
        7. Workshop
      5. Hour 17. Using CSS to Design Navigation
        1. How Navigation Lists Differ from Regular Lists
        2. Creating Vertical Navigation with CSS
        3. Creating Horizontal Navigation with CSS
        4. Summary
        5. Q&A
        6. Workshop
      6. Hour 18. Using Mouse Actions to Modify Text Display
        1. Creating a ToolTip with CSS
        2. Displaying Additional Rollover Text with CSS
        3. Accessing Events
        4. Using onclick to Change <div> Appearance
        5. Summary
        6. Q&A
        7. Workshop
      7. Hour 19. Implementing CSS3 Transformations, Transitions, and Animations
        1. Accounting for Browser Differences
        2. Using 2D Transformations
        3. Using 3D Transformations
        4. Implementing CSS3 Transitions
        5. Getting Started with CSS3 Animation
        6. Summary
        7. Q&A
        8. Workshop
    12. Part IV: Advanced Website Functionality and Management
      1. Hour 20. Creating Print-Friendly Web Pages
        1. What Makes a Page Print-Friendly?
        2. Applying a Media-Specific Stylesheet
        3. Designing a Stylesheet for Print Pages
        4. Viewing a Web Page in Print Preview
        5. Summary
        6. Q&A
        7. Workshop
      2. Hour 21. Understanding Dynamic Websites and HTML5 Applications
        1. Understanding the Different Types of Scripting
        2. Including JavaScript in HTML
        3. Displaying Random Content
        4. Understanding the Document Object Model
        5. Changing Images Based on User Interaction
        6. Thinking Ahead to Developing HTML5 Applications
        7. Summary
        8. Q&A
        9. Workshop
      3. Hour 22. Working with Web-Based Forms
        1. How HTML Forms Work
        2. Creating a Form
        3. Accepting Text Input
        4. Naming Each Piece of Form Data
        5. Exploring Form Input Controls
        6. Using HTML5 Form Validation
        7. Submitting Form Data
        8. Summary
        9. Q&A
        10. Workshop
      4. Hour 23. Organizing and Managing a Website
        1. When One Page Is Enough
        2. Organizing a Simple Site
        3. Organizing a Larger Site
        4. Writing Maintainable Code
        5. Thinking About Version Control
        6. Using HTML and CSS Frameworks
        7. Summary
        8. Q&A
        9. Workshop
      5. Hour 24. Helping People Find Your Web Pages
        1. Publicizing Your Website
        2. Listing Your Pages with the Major Search Sites
        3. Providing Hints for Search Engines
        4. Additional Tips for Search Engine Optimization
        5. Summary
        6. Q&A
        7. Workshop
    13. Index