The Definitive Guide to HTML5 by Freeman, Adam -- Read -- Imperial Library of Trantor

Index

Cover Title Copyright Dedication Contents at a Glance Contents About the Author About the Technical Reviewers Acknowledgments PART I: Getting Started CHAPTER 1: Putting HTML5 in Context

The History of HTML

The Introduction of JavaScript The End of the Browser Wars The Dominance of Plugins The Emergence of Semantic HTML The Trend: The HTML Standard Lags Behind HTML Use

Introducing HTML5

The New Standard(s) Embracing Native Multimedia Embracing Programmatic Content Embracing the Semantic Web

The Current State of HTML5

Browser Support for HTML5 Site Support for HTML5

The Structure of This Book Finding More Information About HTML5 Summary

CHAPTER 2: Getting Ready

Selecting a Browser Selecting an HTML Editor Selecting a Web Server Obtaining Node.js

Obtaining the Multipart Module

Getting the Sample Code Summary

CHAPTER 3: Getting Started with HTML

Using Elements

Understanding the Elements Used in This Chapter Using Empty Elements Using Self-Closing Tags Using Void Elements

Using Element Attributes

Applying Multiple Attributes to an Element Using Boolean Attributes Using Custom Attributes

Creating an HTML Document

The Outer Structure The Metadata The Content Understanding Parents, Children, Descendants, and Siblings Understanding Element Types

Using HTML Entities The HTML5 Global Attributes

The accesskey Attribute The class Attribute The contenteditable Attribute The contextmenu Attribute The dir Attribute The draggable Attribute The dropzone Attribute The hidden Attribute The id Attribute The lang Attribute The spellcheck Attribute The style Attribute The tabindex Attribute The title Attribute

Useful HTML Tools Summary

CHAPTER 4: Getting Started with CSS

Defining and Applying a Style

Understanding the CSS Properties Used in This Chapter Applying a Style Inline Creating an Embedded Style Using an External Stylesheet

Understanding How Styles Cascade and Inherit

Understanding Browser Styles Understanding User Styles Understanding How Styles Cascade Tweaking the Order with Important Styles Tie-Breaking with Specificity and Order Assessments Understanding Inheritance

Working with CSS Colors

Specifying More Complex Colors

Understanding CSS Lengths

Working with Absolute Lengths Working with Relative Lengths

Other CSS Units

Using CSS Angles Using CSS Times

Testing for CSS Feature Support Useful CSS Tools

Browser Style Reporting Creating Selectors with SelectorGadget Enhancing CSS with LESS Using a CSS Framework

Summary

CHAPTER 5: Getting Started with JavaScript

Getting Ready to Use JavaScript Using Statements Defining and Using Functions

Defining Functions with Parameters Defining Functions That Return Results

Using Variables and Types

Using the Primitive Types Creating Objects Working with Objects

Using JavaScript Operators

Using the Equality and Identity Operators Explicitly Converting Types

Working with Arrays

Using an Array Literal Reading and Modifying the Contents of an Array Enumerating the Contents of an Array Using the Built-in Array Methods

Handling Errors Comparing the undefined and null Values

Checking Whether a Variable or Property Is null or undefined Differentiating Between null and undefined

Useful JavaScript Tools

Using a JavaScript Debugger Using a JavaScript Library

Summary

PART II: The HTML Elements CHAPTER 6: HTML Elements in Context

Understanding the Sematic/Presentation Divide Understanding How to Select Elements

Less Can Be More Don't Abuse Elements Be Specific and Consistent Don't Make Assumptions About the Audience

Understanding Element Descriptions Element Quick Reference

The Document and Metadata Elements The Text Elements Grouping Content Sectioning Content Creating Tables Creating Forms Embedding Content

Unimplemented Elements Summary

CHAPTER 7: Creating HTML Documents

Setting Up the Basic Document Structure

The doctype Element The html Element The head Element The body Element

Describing Documents with the Metadata Elements

Setting the Document Title Setting the Base for Relative URLs Using Metadata to Describe the Document Defining CSS Styles Denoting External Resources

Using the Scripting Elements

The script Element The noscript Element

Summary

CHAPTER 8: Marking Up Text

Creating Hyperlinks

Creating External Hyperlinks Creating Relative URLs Creating Internal Hyperlinks Targeting a Browsing Context

Annotating Content with the Basic Text Elements

Denoting Keywords and Product Names Adding Emphasis Denoting Foreign or Technical Terms Showing Inaccuracies or Corrections Denoting Important Text Underlining Text Adding Fine Print Adding Superscript and Subscript

Creating Breaks

Forcing a Line Break Indicating an Opportunity for a Safe Line Break

Representing Inputs and Outputs Creating Citations, Quotations, Definitions, and Abbreviations

Denoting Abbreviations Defining Terms Quoting Content from Another Source Citing the Title of Another Work

Working with the Language Elements

The ruby, rt, and rp Elements The bdo Element The bdi Element

Wrapping Up: The Other Text Elements

Denoting a Generic Span of Content Highlighting Text Denoting Added or Removed Content Denoting Times and Dates

Summary

CHAPTER 9: Grouping Content

Understanding the Need to Group Content Creating Paragraphs Using the div Element Working with Preformatted Content Quoting from Other Sources Adding Thematic Breaks Grouping Content into Lists

The ol Element The ul Element The li Element Creating Description Lists Creating Custom Lists

Dealing with Figures Summary

CHAPTER 10: Creating Sections

Adding Basic Headings Hiding Subheadings Creating Sections Adding Headers and Footers Adding Navigation Blocks Working with Articles Creating Sidebars Providing Contact Information Creating a Details Section Summary

CHAPTER 11: Table Elements

Creating a Basic Table Adding Headers Cells Adding Structure to a Table

Denoting the Headings and the Table Body Adding a Footer

Creating Irregular Tables Associating Headers with Cells Adding a Caption to a Table Working with Columns

Calling Out Individual Columns

Applying Borders to the table Element Summary

CHAPTER 12: Working with Forms

Creating a Basic Form

Defining the Form Seeing the Form Data

Configuring the Form

Configuring the Form action Attribute Configuring the HTTP method Attribute Configuring the Data Encoding Controlling Form Completion Specifying a Target for the Form Response Setting the Name of the Form

Adding Labels to a Form Automatically Focusing on an input Element Disabling Individual input Elements Grouping Form Elements Together

Adding a Descriptive Label to a fieldset Element Disabling Groups of Inputs Using the fieldset Element

Using the button Element

Using the button Element to Submit Forms Using the button Element to Reset Forms Using button as a Generic Element

Working with Elements Outside the Form Summary

CHAPTER 13: Customizing the Input Element

Using the input Element for Text Input

Specifying the Element Size Setting Values and Using Placeholders Using a Data List Creating Read-Only and Disabled Text Boxes Specifying Text Directionality

Using the input Element for Password Input Using the input Element to Create Buttons Using the input Element to Restrict Data Entry

Using the input Element to Obtain a Number Using the input Element to Obtain a Number in a Given Range Using the input Element to Obtain a Boolean Response Using the input Element to Create Fixed Choices Using the input Element to Obtain Formatted Strings Using the input Element to Obtain Times and Dates Using the input Element to Obtain a Color

Using the input Element to Obtain Search Terms Using the input Element to Create Hidden Data Items Using the input Element to Create Image Buttons and Maps Using the input Element to Upload Files Summary

CHAPTER 14: Other Form Elements and Input Validation

Using the Other Form Elements

Creating Lists of Options Capturing Multiple Lines of Text Denoting the Result of a Calculation Creating Public/Private Key Pairs

Using Input Validation

Ensuring the User Provides a Value Ensuring a Value Is Within Bounds Ensuring a Value Matches a Pattern Ensuring a Value Is an E-mail Address or URL

Disabling Input Validation Summary

CHAPTER 15: Embedding Content

Embedding an Image

Embedding an Image in a Hyperlink Creating a Client-Side Image Map

Embedding Another HTML Document Embedding Content Using Plugins

Using the embed Element Using the object and param Elements

Other Uses for the object Element

Using the object Element to Embed Images Using the object Element to Create Client-Side Image Maps Using the object Element as a Browsing Context

Embedding Numeric Representations

Showing Progress Showing a Ranged Value

Other Embedding Elements

Embedding Audio and Video Embedding Graphics

Summary

PART III: Cascading Style Sheets CHAPTER 16: CSS in Context

Understanding CSS Standardization Understanding the Box Model Selectors Quick Reference Properties Quick Reference

Border and Background Properties Box Model Properties Layout Properties Text Properties Transition, Animation, and Transform Properties Other Properties

Summary

CHAPTER 17: Using the CSS Selectors—Part I

Using the Basic CSS Selectors

Selecting All Elements Selecting Elements by Type Selecting Elements by Class Selecting Elements by ID Selecting Elements by Attribute

Combining Selectors

Creating Selector Unions Selecting Descendant Elements Selecting Child Elements Selecting Sibling Elements

Using Pseudo-Element Selectors

Using the ::first-line Selector Using the ::first-letter Selector Using the :before and :after Selectors Using the CSS Counter Feature

Summary

CHAPTER 18: Using the CSS Selectors—Part II

Using the Structural Pseudo-Class Selectors

Using the :root Selector Using the Child Selectors Using the nth-Child Selectors

Using the UI Pseudo-Class Selectors

Selecting Enabled/Disabled Elements Selecting Checked Elements Selecting Default Elements Selecting Valid and Invalid input Elements Selecting input Elements with Range Limitations Selecting Required and Optional input Elements

Using the Dynamic Pseudo-Class Selectors

Using the :link and :visited Selectors Using the :hover Selector Using the :active Selector Using the :focus Selector

Other Pseudo-Selectors

Using the Negation Selector Using the :empty Selector Using the :lang Selector Using the :target Selector

Summary

CHAPTER 19: Using Borders and Backgrounds

Applying a Border

Defining the Border Width Defining the Border Style Applying a Border to a Single Side Using the border Shorthand Properties Creating a Border with Rounded Corners Using Images As Borders

Setting Element Backgrounds

Setting the Background Color and Image Setting the Background Image Size Setting the Background Image Position Setting the Attachment for the Background Setting the Background Image Origin and Clipping Style Using the background Shorthand Property

Creating a Box Shadow Using Outlines Summary

CHAPTER 20: Working with the Box Model

Applying Padding to an Element Appling Margin to an Element Controlling the Size of an Element

Setting the Sized Box Setting Minimum and Maximum Sizes

Dealing with Overflowing Content Controlling Element Visibility Setting an Element Box Type

Understanding Block-Level Elements Understanding Inline-Level Elements Understanding Inline-Block Elements Understanding Run-In Elements Hiding Elements

Creating Floating Boxes

Preventing Floating Elements from Stacking Up

Summary

CHAPTER 21: Creating Layouts

Positioning Content

Setting the Position Type Setting the Z-Order

Creating Multicolumn Layouts Creating Flexible Box Layouts

Creating a Simple Flexbox Flexing Multiple Elements Dealing with Vertical Space Dealing with Maximum Sizes

Creating Table Layouts Summary

CHAPTER 22: Styling Text

Applying Basic Text Styles

Aligning and Justifying Text Dealing with Whitespace Specifying Text Direction Specifying the Space Between Words, Letters, and Lines Controlling Word Breaks Indenting the First Line

Decorating and Transforming Text Creating Text Shadows Working with Fonts

Selecting a Font Setting the Font Size Setting the Font Style and Weight

Using Web Fonts Summary

CHAPTER 23: Transitions, Animations, and Transforms

Using Transitions

Creating Inverse Transitions Selecting How Intermediate Values Are Calculated

Using Animations

Working with Key Frames Setting the Repeat Direction Understanding the End State Applying Animations to the Initial Layout Reusing Key Frames Applying Multiple Animations to Multiple Elements Stopping and Starting Animations

Using Transforms

Applying a Transform Specifying an Origin Animating and Transitioning a Transform

Summary

CHAPTER 24: Other CSS Properties and Features

Setting Element Color and Transparency

Setting the Foreground Color Setting Element Opacity

Styling Tables

Collapsing Table Borders Configuring Separated Borders Dealing with Empty Cells Positioning the Caption Specifying the Table Layout

Styling Lists

Setting the List Marker Type Using an Image As a List Marker Positioning the Marker

Styling the Cursor Summary

PART IV: Working with the DOM CHAPTER 25: The DOM in Context

Understanding the Document Object Model Understanding DOM Levels and Compliance

Testing for DOM Features

The DOM Quick Reference

The Document Members The Window Members The HTMLElement Members DOM CSS Properties The DOM Events

Summary

CHAPTER 26: Working with the Document Object

Working with Document Metadata

Getting Information from the Document Using the Location Object Reading and Writing Cookies Understanding the Ready State Getting DOM Implementation Details

Obtaining HTML Element Objects

Using Properties to Obtain Element Objects Using Array Notation to Obtain a Named Element Searching for Elements Chaining Searches Together

Navigating the DOM Tree Summary

CHAPTER 27: Working with the Window Object

Obtaining a Window Object Getting Information about the Window Interacting with the Window Prompting the User Getting General Information Working with the Browser History

Navigating Within the Browsing History Inserting an Entry into the History Adding an Entry for a Different Document Storing Complex State in the History Replacing an Item in the History

Using Cross-Document Messaging Using Timers Summary

CHAPTER 28: Working with DOM Elements

Working with Element Objects

Working with Classes Working with Element Attributes

Working with Text Modifying the Model

Creating and Deleting Elements Duplicating Elements Moving Elements Comparing Element Objects Working with HTML Fragments Inserting an Element into a Text Block

Summary

CHAPTER 29: Styling DOM Elements

Working with Stylesheets

Getting Basic Information About Stylesheets Working with Media Constraints Disabling Stylesheets Working with Individual Styles

Working with Element Styles Working with CSSStyleDeclaration Objects

Working with the Convenience Properties Working with the Regular Properties Using the Fine-Grained CSS DOM Objects

Working with Computed Styles Summary

CHAPTER 30: Working with Events

Using Simple Event Handlers

Implementing a Simple Inline Event Handler Implementing a Simple Event-Handling Function

Using the DOM and the Event Object

Distinguishing Events by Type Understanding Event Flow Working with Cancellable Events

Working with the HTML Events

The Document and Window Events Working with Mouse Events Working with Focus Events Working with Keyboard Events Working with Form Events

Summary

CHAPTER 31: Using the Element-Specific Objects

The Document and Metadata Objects

The base Element The body Element The link Element The meta Element The script Element The style Element The title Element Other Document and Metadata Elements

The Text Elements

The a Element The del and ins Elements The q Element The time Element Other Text Elements

The Grouping Elements

The blockquote Element The li Element The ol Element Other Grouping Elements

The Section Elements

The details Element Other Section Elements

The Table Elements

The col and colgroup Elements The table Element The thead, tbody, and tfoot Elements The th Element The tr Element Other Table Elements

The Form Elements

The button Element The datalist Element The fieldset Element The form Element The input Element The label Element The legend Element The optgroup Element The option Element The output Element The select Element The textarea Element

The Content Elements

The area Element The embed Element The iframe Element The img Elements The map Element The meter Element The object Element The param Element The progress Element

Summary

PART V: Advanced Features CHAPTER 32: Using Ajax – Part I

Getting Started with Ajax

Dealing with the Response The Lowest Common Dominator: Dealing with Opera

Using the Ajax Events Dealing with Errors

Dealing with Setup Errors Dealing with Request Errors Dealing with Application Errors

Getting and Setting Headers

Overriding the Request HTTP Method Disabling Content Caching Reading Response Headers

Making Cross-Origin Ajax Requests

Using the Origin Request Header Advanced CORS Features

Aborting Requests Summary

CHAPTER 33: Using Ajax—Part II

Getting Ready to Send Data to the Server

Defining the Server Understanding the Problem

Sending Form Data Sending Form Data Using a FormData Object

Creating a FormData Object Modifying a FormData Object

Sending JSON Data Sending Files Tracking Upload Progress Requesting and Processing Different Content Types

Receiving HTML Fragments Receiving XML Data Receiving JSON Data

Summary

CHAPTER 34: Working with Multimedia

Using the video Element

Preloading the Video Displaying a Placeholder Image Setting the Video Size Specifying the Video Source (and Format) The track Element

Using the audio Element Working with Embedded Media via the DOM

Getting Information About the Media Assessing Playback Capabilities Controlling Media Playback

Summary

CHAPTER 35: Using the Canvas Element – Part I

Getting Started with the Canvas Element Getting a Canvas Context Drawing Rectangles Setting the Canvas Drawing State

Setting the Line Join Style Setting the Fill & Stroke Styles Using Gradients Using a Radial Gradient Using Patterns

Saving and Restoring Drawing State Drawing Images

Using Video Images Using Canvas Images

Summary

CHAPTER 36: Using the Canvas Element – Part II

Drawing Using Paths

Drawing Paths with Lines Drawing Rectangles

Drawing Arcs

Using the arcTo Method Using the arc Method

Drawing Bezier Curves

Drawing Cubic Bezier Curves Drawing Quadratic Bezier Curves

Creating a Clipping Region Drawing Text Using Effects and Transformations

Using Shadows Using Transparency Using Composition Using a Transformation

Summary

CHAPTER 37: Using Drag & Drop

Creating the Source Items

Handling the Drag Events

Creating the Drop Zone

Receiving the Drop

Working with the DataTransfer Object

Filtering Dragged Items by Data Dragging and Dropping Files

Summary

CHAPTER 38: Using Geolocation

Using Geolocation

Getting the Current Position

Handling Geolocation Errors Specifying Geolocation Options Monitoring the Position Summary

CHAPTER 39: Using Web Storage

Using Local Storage

Listening for Storage Events

Using Session Storage Summary

CHAPTER 40: Creating Offline Web Applications

Defining the Problem Defining the Manifest

Specifying Manifest Sections Defining the Fallback Section Defining the Network Section

Detecting the Browser State Working with the Offline Cache

Making the Update Getting the Update Applying the Update

Summary

Index

← Prev
Back
Next →

← Prev
Back
Next →