Home Page Icon
Home Page
Table of Contents for
HTML5 and CSS3 All-in-One For Dummies®, 3rd Edition
Close
HTML5 and CSS3 All-in-One For Dummies®, 3rd Edition
by Andy Harris
HTML5 and CSS3 All-in-One For Dummies, 3rd Edition
Introduction
Introduction
About This Book
Foolish Assumptions
Use Any Computer
Don't Buy Any Software
How This Book Is Organized
New for the Third Edition
Icons Used in This Book
Beyond the Book
Where to Go from Here
Book I: Creating the HTML Foundation
Chapter 1: Sound HTML Foundations
Creating a Basic Page
Understanding the HTML in the Basic Page
Meeting Your New Friends, the Tags
Setting Up Your System
Displaying file extensions
Setting up your software
Chapter 2: It's All About Validation
Somebody Stop the HTML Madness!
XHTML had some great ideas
Validating Your Page
Aesop visits W3C
Using Tidy to repair pages
Chapter 3: Choosing Your Tools
What's Wrong with the Big Boys: Expression Web and Adobe Dreamweaver
How About Online Site Builders?
Alternative Web Development Tools
Picking a Text Editor
Tools to avoid unless you have nothing else
Suggested programmer's editors
My personal choice: Komodo Edit
Other text editors
The bottom line on editors
Finding a Good Web Developer's Browser
A little ancient history
Overview of the prominent browsers
Other notable browsers
The bottom line in browsers
Chapter 4: Managing Information with Lists and Tables
Making a List and Checking It Twice
Creating an unordered list
Creating ordered lists
Making nested lists
Building the definition list
Building Tables
Defining the table
Spanning rows and columns
Avoiding the table-based layout trap
Chapter 5: Making Connections with Links
Making Your Text Hyper
Introducing the anchor tag
Comparing block-level and inline elements
Analyzing an anchor
Introducing URLs
Making Lists of Links
Working with Absolute and Relative References
Understanding absolute references
Introducing relative references
Chapter 6: Adding Images, Sound, and Video
Adding Images to Your Pages
Linking to an image
Adding inline images using the <img> tag
src (source)
height and width
alt (alternate text)
Choosing an Image Manipulation Tool
An image is worth 3.4 million words
Introducing IrfanView
Choosing an Image Format
BMP
JPG/JPEG
GIF
PNG
SVG
Summary of web image formats
Manipulating Your Images
Changing formats in IrfanView
Resizing your images
Enhancing image colors
Using built-in effects
Other effects you can use
Batch processing
Working with Audio
Adding Video
Chapter 7: Creating Forms
You Have Great Form
Forms must have some form
Building Text-Style Inputs
Making a standard text field
Building a password field
Making multi-line text input
Creating Multiple Selection Elements
Making selections
Building check boxes
Creating radio buttons
Pressing Your Buttons
Making input-style buttons
Building a Submit button
It's a do-over: The Reset button
Introducing the <button> tag
New Form Input Types
date
time
datetime
datetime-local
week
month
color
number
range
search
email
tel
url
Book II: Styling with CSS
Chapter 1: Coloring Your World
Now You Have an Element of Style
Setting up a style sheet
Changing the colors
Specifying Colors in CSS
Using color names
Putting a hex on your colors
Coloring by number
Hex education
Using the web-safe color palette
Choosing Your Colors
Starting with web-safe colors
Modifying your colors
Doing it on your own pages
Changing CSS on the fly
Creating Your Own Color Scheme
Understanding hue, saturation, and lightness
Using HSL colors in your pages
Using the Color Scheme Designer
Selecting a base hue
Picking a color scheme
Chapter 2: Styling Text
Setting the Font Family
Applying the font-family style attribute
Using generic fonts
Making a list of fonts
The Curse of Web-Based Fonts
Understanding the problem
Using embedded fonts
Using images for headlines
Specifying the Font Size
Size is only a suggestion!
Using the font-size style attribute
Absolute measurement units
Relative measurement units
Determining Other Font Characteristics
Using font-style for italics
Using font-weight for bold
Using text-decoration
Using text-align for basic alignment
Other text attributes
Using the font shortcut
Working with subscripts and superscripts
Chapter 3: Selectors: Coding with Class and Style
Selecting Particular Segments
Defining more than one kind of paragraph
Styling identified paragraphs
Using Emphasis and Strong Emphasis
Modifying the Display of em and strong
Defining Classes
Adding classes to the page
Using classes
Combining classes
Introducing div and span
Organizing the page by meaning
Why not make a table?
Using Pseudo-Classes to Style Links
Styling a standard link
Styling the link states
Best link practices
Selecting in Context
Defining Styles for Multiple Elements
Using New CSS3 Selectors
Attribute selection
not
nth-child
Other new pseudo-classes
Chapter 4: Borders and Backgrounds
Joining the Border Patrol
Using the border attributes
Defining border styles
Using the border shortcut
Creating partial borders
Introducing the Box Model
Border, margin, and padding
Positioning elements with margins and padding
New CSS3 Border Techniques
Image borders
Adding Rounded Corners
Adding a box shadow
Changing the Background Image
Getting a background check
Solutions to the background conundrum
Manipulating Background Images
Turning off the repeat
Using CSS3 Gradients
Using Images in Lists
Chapter 5: Levels of CSS
Managing Levels of Style
Using local styles
Using an external style sheet
Understanding the Cascading Part of Cascading Style Sheets
Inheriting styles
Hierarchy of styles
Overriding styles
Precedence of style definitions
Managing Browser Incompatibility
Coping with incompatibility
Making Internet Explorer–specific code
Using a conditional comment with CSS
Checking the Internet Explorer version
Using a CSS reset
Chapter 6: CSS Special Effects
Image Effects
Transparency
Reflections
Text Effects
Text stroke
Text-shadow
Transformations and Transitions
Transformations
Three-dimensional transformations
Transition animation
Animations
Book III: Building Layouts with CSS
Chapter 1: Fun with the Fabulous Float
Avoiding Old-School Layout Pitfalls
Problems with frames
Problems with tables
Problems with huge images
Problems with Flash
Introducing the Floating Layout Mechanism
Using float with images
Adding the float property
Using Float with Block-Level Elements
Floating a paragraph
Adjusting the width
Setting the next margin
Using Float to Style Forms
Using float to beautify the form
Adjusting the fieldset width
Using the clear attribute to control page layout
Chapter 2: Building Floating Page Layouts
Creating a Basic Two-Column Design
Designing the page
Building the HTML
Using temporary background colors
Setting up the floating columns
Tuning up the borders
Advantages of a fluid layout
Using semantic tags
Building a Three-Column Design
Styling the three-column page
Problems with the floating layout
Specifying a min-height
Using height and overflow
Building a Fixed-Width Layout
Setting up the HTML
Fixing the width with CSS
Building a Centered Fixed-Width Layout
Making a surrogate body with an all div
How the jello layout works
Limitations of the jello layout
Chapter 3: Styling Lists and Menus
Revisiting List Styles
Defining navigation as a list of links
Turning links into buttons
Building horizontal lists
Creating Dynamic Lists
Building a nested list
Hiding the inner lists
Getting the inner lists to appear on cue
Building a Basic Menu System
Building a vertical menu with CSS
Building a horizontal menu
Chapter 4: Using Alternative Positioning
Working with Absolute Positioning
Setting up the HTML
Adding position guidelines
Making absolute positioning work
Managing z-index
Handling depth
Working with z-index
Building a Page Layout with Absolute Positioning
Overview of absolute layout
Writing the HTML
Adding the CSS
Creating a More Flexible Layout
Designing with percentages
Building the layout
Exploring Other Types of Positioning
Creating a fixed menu system
Setting up the HTML
Setting the CSS values
Flexible Box Layout Model
Creating a flexible box layout
Viewing a flexible box layout
… And now for a little reality
Determining Your Layout Scheme
Book IV: Client-Side Programming with JavaScript
Chapter 1: Getting Started with JavaScript
Working in JavaScript
Choosing a JavaScript editor
Picking your test browser
Writing Your First JavaScript Program
Embedding your JavaScript code
Creating comments
Using the alert() method for output
Adding the semicolon
Introducing Variables
Creating a variable for data storage
Asking the user for information
Responding to the user
Using Concatenation to Build Better Greetings
Comparing literals and variables
Including spaces in your concatenated phrases
Understanding the String Object
Introducing object-based programming (and cows)
Investigating the length of a string
Using string methods to manipulate text
Understanding Variable Types
Adding numbers
Adding the user's numbers
The trouble with dynamic data
The pesky plus sign
Changing Variables to the Desired Type
Using variable conversion tools
Fixing the addInput code
Chapter 2: Talking to the Page
Understanding the Document Object Model
Previewing the DOM
Getting the blues, JavaScript-style
Writing JavaScript code to change colors
Managing Button Events
Adding a function for more … functionality
Making a more flexible function
Embedding quotes within quotes
Writing the changeColor function
Managing Text Input and Output
Introducing event-driven programming
Creating the HTML form
Using getElementById to get access to the page
Manipulating the text fields
Writing to the Document
Preparing the HTML framework
Writing the JavaScript
Finding your innerHTML
Working with Other Text Elements
Building the form
Writing the function
Understanding generated source
What if you're not in Chrome?
Chapter 3: Decisions and Debugging
Making Choices with if
Changing the greeting with if
The different flavors of if
Conditional operators
Nesting your if statements
Making decisions with switch
Managing Repetition with for Loops
Setting up the web page
Initializing the output
Creating the basic for loop
Introducing shortcut operators
Counting backwards
Counting by fives
Understanding the Zen of for loops
Building while Loops
Making a basic while loop
Getting your loops to behave
Managing more complex loops
Managing Errors with a Debugger
Debugging with the interactive console
Debugging strategies
Resolving syntax errors
Squashing logic bugs
Chapter 4: Functions, Arrays, and Objects
Breaking Code into Functions
Thinking about structure
Building the antsFunction.html program
Passing Data to and from Functions
Examining the makeSong code
Looking at the chorus
Handling the verses
Managing Scope
Introducing local and global variables
Examining variable scope
Building a Basic Array
Accessing array data
Using arrays with for loops
Revisiting the ants song
Working with Two-Dimension Arrays
Setting up the arrays
Getting a city
Creating a main() function
Creating Your Own Objects
Building a basic object
Adding methods to an object
Building a reusable object
Using your shiny new objects
Introducing JSON
Storing data in JSON format
Building a more complex JSON structure
Chapter 5: Getting Valid Input
Getting Input from a Drop-Down List
Building the form
Reading the list box
Managing Multiple Selections
Coding a multiple selection select object
Writing the JavaScript code
Check, Please: Reading Check Boxes
Building the check box page
Responding to the check boxes
Working with Radio Buttons
Interpreting Radio Buttons
Working with Regular Expressions
Introducing regular expressions
Using characters in regular expressions
Marking the beginning and end of the line
Working with special characters
Conducting repetition operations
Working with pattern memory
New HTML5/CSS3 Tricks for Validation
Adding a pattern
Marking a field as required
Adding placeholder text
Chapter 6: Drawing on the Canvas
Canvas Basics
Setting up the canvas
How <canvas> works
Fill and Stroke Styles
Colors
Gradients
Patterns
Drawing Essential Shapes
Rectangle functions
Drawing text
Adding shadows
Working with Paths
Line-drawing options
Drawing arcs and circles
Drawing quadratic curves
Building a Bézier curve
Images
Drawing an image on the canvas
Drawing part of an image
Manipulating Pixels
Chapter 7: Animation with the Canvas
Transformations
Building a transformed image
A few thoughts about transformations
Animation
Overview of the animation loop
Setting up the constants
Initializing the animation
Animate the current frame
Moving an element
Bouncing off the walls
Reading the Keyboard
Managing basic keyboard input
Moving an image with the keyboard
Book V: Server-Side Programming with PHP
Chapter 1: Getting Started on the Server
Introducing Server-Side Programming
Programming on the server
Serving your programs
Picking a language
Installing Your Web Server
Inspecting phpinfo()
Building HTML with PHP
Coding with Quotation Marks
Working with Variables PHP-Style
Concatenation
Interpolating variables into text
Building HTML Output
Using double quote interpolation
Generating output with heredocs
Switching from PHP to HTML
Chapter 2: PHP and HTML Forms
Exploring the Relationship between PHP and HTML
Embedding PHP inside HTML
Viewing the results
Sending Data to a PHP Program
Creating a form for PHP processing
Receiving data in PHP
Choosing the Method of Your Madness
Using get to send data
Using the post method to transmit form data
Getting data from the form
Retrieving Data from Other Form Elements
Building a form with complex elements
Responding to a complex form
Chapter 3: Using Control Structures
Introducing Conditions (Again)
Building the Classic if Statement
Rolling dice the PHP way
Checking your six
Understanding comparison operators
Taking the middle road
Building a program that makes its own form
Making a switch
Looping with for
Looping with while
Chapter 4: Working with Arrays
Using One-Dimensional Arrays
Creating an array
Filling an array
Viewing the elements of an array
Preloading an array
Using Loops with Arrays
Simplifying loops with foreach
Arrays and HTML
Introducing Associative Arrays
Using foreach with associative arrays
Introducing Multidimensional Arrays
We're going on a trip
Looking up the distance
Breaking a String into an Array
Creating arrays with explode
Creating arrays with preg_split
Chapter 5: Using Functions and Session Variables
Creating Your Own Functions
Rolling dice the old-fashioned way
Improving code with functions
Managing variable scope
Returning data from functions
Managing Persistence with Session Variables
Understanding session variables
Adding session variables to your code
Chapter 6: Working with Files and Directories
Text File Manipulation
Writing text to files
Writing a basic text file
Reading from the file
Using Delimited Data
Storing data in a CSV file
Viewing CSV data directly
Reading the CSV data in PHP
Working with File and Directory Functions
opendir( )
readdir( )
chdir( )
Generating the list of file links
Chapter 7: Exceptions and Objects
Object-Oriented Programming in PHP
Building a basic object
Using your brand-new class
Protecting your data with access modifiers
Using access modifiers
You've Got Your Momma's Eyes: Inheritance
Building a critter based on another critter
How to inherit the wind (and anything else)
Catching Exceptions
Introducing exception handling
Knowing when to trap for exceptions
Book VI: Managing Data with MySQL
Chapter 1: Getting Started with Data
Examining the Basic Structure of Data
Determining the fields in a record
Introducing SQL data types
Specifying the length of a record
Defining a primary key
Defining the table structure
Introducing MySQL
Why use MySQL?
Understanding the three-tier architecture
Practicing with MySQL
Setting Up phpMyAdmin
Changing the root password
Adding a user
Using phpMyAdmin on a remote server
Implementing a Database with phpMyAdmin
Chapter 2: Managing Data with MySQL
Writing SQL Code by Hand
Understanding SQL syntax rules
Examining the buildContact.sql script
Dropping a table
Creating a table
Adding records to the table
Viewing the sample data
Running a Script with phpMyAdmin
Using AUTO_INCREMENT for Primary Keys
Selecting Data from Your Tables
Selecting only a few fields
Selecting a subset of records
Searching with partial information
Searching for the ending value of a field
Searching for any text in a field
Searching with regular expressions
Sorting your responses
Editing Records
Updating a record
Deleting a record
Exporting Your Data and Structure
Exporting SQL code
Creating XML data
Chapter 3: Normalizing Your Data
Recognizing Problems with Single-Table Data
The identity crisis
The listed powers
Repetition and reliability
Fields with changeable data
Deletion problems
Introducing Entity-Relationship Diagrams
Using MySQL Workbench to draw ER diagrams
Creating a table definition in Workbench
Introducing Normalization
First normal form
Second normal form
Third normal form
Identifying Relationships in Your Data
Chapter 4: Putting Data Together with Joins
Calculating Virtual Fields
Introducing SQL functions
Knowing when to calculate virtual fields
Calculating Date Values
Using DATEDIFF to determine age
Adding a calculation to get years
Converting the days integer into a date
Using YEAR() and MONTH() to get readable values
Concatenating to make one field
Creating a View
Using an Inner Join to Combine Tables
Building a Cartesian join and an inner join
Enforcing one-to-many relationships
Counting the advantages of inner joins
Building a view to encapsulate the join
Managing Many-to-Many Joins
Understanding link tables
Using link tables to make many-to-many joins
Chapter 5: Connecting PHP to a MySQL Database
PHP and MySQL: A Perfect (but Geeky) Romance
Understanding data connections
Introducing PDO
Building a connection
Retrieving data from the database
Using HTML tables for output
Allowing User Interaction
Building an HTML search form
Responding to the search request
Book VII: Integrating the Client and Server with AJAX
Chapter 1: AJAX Essentials
AJAX Spelled Out
A is for asynchronous
J is for JavaScript
A is for . . . and?
And X is for . . . data
Making a Basic AJAX Connection
Building the HTML form
Creating an XMLHttpRequest object
Opening a connection to the server
Sending the request and parameters
Checking the status
All Together Now — Making the Connection Asynchronous
Setting up the program
Building the getAJAX() function
Reading the response
Chapter 2: Improving JavaScript and AJAX with jQuery
Introducing jQuery
Installing jQuery
Importing jQuery from Google
Your First jQuery App
Setting up the page
Meet the jQuery node object
Creating an Initialization Function
Using $(document).ready()
Alternatives to document.ready
Investigating the jQuery Object
Changing the style of an element
Selecting jQuery objects
Modifying the style
Adding Events to Objects
Adding a hover event
Changing classes on the fly
Making an AJAX Request with jQuery
Including a text file with AJAX
Building a poor man's CMS with AJAX
Chapter 3: Animating jQuery
Playing Hide and Seek
Getting transition support
Writing the HTML and CSS foundation
Initializing the page
Hiding and showing the content
Toggling visibility
Sliding an element
Fading an element in and out
Changing Position with jQuery
Creating the framework
Setting up the events
Building the move() function with chaining
Building time-based animation with animate()
Move a little bit: Relative motion
Modifying Elements on the Fly
Building the basic page
Initializing the code
Adding text
Attack of the clones
It's a wrap
Alternating styles
Resetting the page
More fun with selectors and filters
Chapter 4: Using the jQuery User Interface Toolkit
What the jQuery User Interface Brings to the Table
It's a theme park
Using the themeRoller to get an overview of jQuery
Wanna drag? Making components draggable
Downloading the library
Writing the program
Resizing on a Theme
Examining the HTML and standard CSS
Importing the files
Making a resizable element
Adding themes to your elements
Adding an icon
Dragging, Dropping, and Calling Back
Building the basic page
Initializing the page
Handling the drop
Beauty school dropout events
Cloning the elements
Chapter 5: Improving Usability with jQuery
Multi-Element Designs
Playing the accordion widget
Building a tabbed interface
Using tabs with AJAX
Improving Usability
Playing the dating game
Picking numbers with the slider
Selectable elements
Building a sortable list
Creating a custom dialog box
Chapter 6: Working with AJAX Data
Sending Requests AJAX Style
Sending the data
Building a Multipass Application
Setting up the HTML framework
Loading the select element
Writing the loadList.php program
Responding to selections
Writing the showHero.php script
Working with XML Data
Review of XML
Manipulating XML with jQuery
Creating the HTML
Retrieving the data
Processing the results
Printing the pet name
Working with JSON Data
Knowing JSON's pros
Reading JSON data with jQuery
Managing the framework
Retrieving the JSON data
Processing the results
Chapter 7: Going Mobile
Thinking in Mobile
Building a Responsive Site
Specifying a media type
Adding a qualifier
Making Your Page Responsive
Building the wide layout
Adding the narrow CSS
Using jQuery Mobile to Build Mobile Interfaces
Building a basic jQuery mobile page
Working with collapsible content
Building a multi-page document
Going from Site to App
Adding an icon to your program
Removing the Safari toolbar
Storing your program offline
Book VIII: Moving from Pages to Sites
Chapter 1: Managing Your Servers
Understanding Clients and Servers
Parts of a client-side development system
Parts of a server-side system
Creating Your Own Server with XAMPP
Running XAMPP
Testing your XAMPP configuration
Adding your own files
Setting the security level
Compromising between functionality and security
Choosing a Web Host
Finding a hosting service
Connecting to a hosting service
Managing a Remote Site
Using web-based file tools
Understanding file permissions
Using FTP to manage your site
Using an FTP client
Naming Your Site
Understanding domain names
Registering a domain name
Managing Data Remotely
Creating your database
Finding the MySQL server name
Chapter 2: Planning Your Sites
Creating a Multipage Website
Planning a Larger Site
Understanding the Client
Ensuring that the client's expectations are clear
Delineating the tasks
Understanding the Audience
Determining whom you want to reach
Finding out the user's technical expertise
Building a Site Plan
Creating a site overview
Building the site diagram
Creating Page Templates
Sketching the page design
Building the HTML template framework
Creating page styles
Building a data framework
Fleshing Out the Project
Making the site live
Contemplating efficiency
Chapter 3: Introducing Content Management Systems
Overview of Content Management Systems
Previewing Common CMSs
Moodle
WordPress
Drupal
Building a CMS site with WebsiteBaker
Installing your CMS
Getting an overview of WebsiteBaker
Adding your content
Using the WYSIWYG editor
Changing the template
Adding additional templates
Adding new functionality
Building Custom Themes
Starting with a prebuilt template
Changing the info.php file
Modifying index.php
Modifying the CSS files
Packaging your template
Chapter 4: Editing Graphics
Using a Graphics Editor
Choosing an Editor
Introducing Gimp
Creating an image
Painting tools
Selection tools
Modification tools
Managing tool options
Utilities
Understanding Layers
Introducing Filters
Solving Common Web Graphics Problems
Changing a color
Building a banner graphic
Building a tiled background
Chapter 5: Taking Control of Content
Building a “Poor Man's CMS” with Your Own Code
Using Server Side Includes (SSIs)
Using AJAX and jQuery for client-side inclusion
Building a page with PHP includes
Creating Your Own Data-Based CMS
Using a database to manage content
Writing a PHP page to read from the table
Allowing user-generated content
Adding a new block
Improving the dbCMS design
About the Author
Cheat Sheet
More Dummies Products
Search in book...
Toggle Font Controls
Playlists
Add To
Create new playlist
Name your new playlist
Playlist description (optional)
Cancel
Create playlist
Sign In
Email address
Password
Forgot Password?
Create account
Login
or
Continue with Facebook
Continue with Google
Sign Up
Full Name
Email address
Confirm Email Address
Password
Login
Create account
or
Continue with Facebook
Continue with Google
Prev
Previous Chapter
01_9781118289389-ffirs.xhtml
Next
Next Chapter
Introduction
HTML5 and CSS3 All-in-One For Dummies®, 3rd Edition
Visit
www.dummies.com/cheatsheet/html5css3aio
to view this book's cheat sheet.
Table of Contents
Introduction
About This Book
Foolish Assumptions
Use Any Computer
Don't Buy Any Software
How This Book Is Organized
New for the Third Edition
Icons Used in This Book
Beyond the Book
Where to Go from Here
Book I: Creating the HTML Foundation
Chapter 1: Sound HTML Foundations
Creating a Basic Page
Understanding the HTML in the Basic Page
Meeting Your New Friends, the Tags
Setting Up Your System
Displaying file extensions
Setting up your software
Chapter 2: It's All About Validation
Somebody Stop the HTML Madness!
XHTML had some great ideas
Validating Your Page
Aesop visits W3C
Using Tidy to repair pages
Chapter 3: Choosing Your Tools
What's Wrong with the Big Boys: Expression Web and Adobe Dreamweaver
How About Online Site Builders?
Alternative Web Development Tools
Picking a Text Editor
Tools to avoid unless you have nothing else
Suggested programmer's editors
My personal choice: Komodo Edit
Other text editors
The bottom line on editors
Finding a Good Web Developer's Browser
A little ancient history
Overview of the prominent browsers
Other notable browsers
The bottom line in browsers
Chapter 4: Managing Information with Lists and Tables
Making a List and Checking It Twice
Creating an unordered list
Creating ordered lists
Making nested lists
Building the definition list
Building Tables
Defining the table
Spanning rows and columns
Avoiding the table-based layout trap
Chapter 5: Making Connections with Links
Making Your Text Hyper
Introducing the anchor tag
Comparing block-level and inline elements
Analyzing an anchor
Introducing URLs
Making Lists of Links
Working with Absolute and Relative References
Understanding absolute references
Introducing relative references
Chapter 6: Adding Images, Sound, and Video
Adding Images to Your Pages
Linking to an image
Adding inline images using the <img> tag
src (source)
height and width
alt (alternate text)
Choosing an Image Manipulation Tool
An image is worth 3.4 million words
Introducing IrfanView
Choosing an Image Format
BMP
JPG/JPEG
GIF
PNG
SVG
Summary of web image formats
Manipulating Your Images
Changing formats in IrfanView
Resizing your images
Enhancing image colors
Using built-in effects
Other effects you can use
Batch processing
Working with Audio
Adding Video
Chapter 7: Creating Forms
You Have Great Form
Forms must have some form
Building Text-Style Inputs
Making a standard text field
Building a password field
Making multi-line text input
Creating Multiple Selection Elements
Making selections
Building check boxes
Creating radio buttons
Pressing Your Buttons
Making input-style buttons
Building a Submit button
It's a do-over: The Reset button
Introducing the <button> tag
New Form Input Types
date
time
datetime
datetime-local
week
month
color
number
range
search
email
tel
url
Book II: Styling with CSS
Chapter 1: Coloring Your World
Now You Have an Element of Style
Setting up a style sheet
Changing the colors
Specifying Colors in CSS
Using color names
Putting a hex on your colors
Coloring by number
Hex education
Using the web-safe color palette
Choosing Your Colors
Starting with web-safe colors
Modifying your colors
Doing it on your own pages
Changing CSS on the fly
Creating Your Own Color Scheme
Understanding hue, saturation, and lightness
Using HSL colors in your pages
Using the Color Scheme Designer
Selecting a base hue
Picking a color scheme
Chapter 2: Styling Text
Setting the Font Family
Applying the font-family style attribute
Using generic fonts
Making a list of fonts
The Curse of Web-Based Fonts
Understanding the problem
Using embedded fonts
Using images for headlines
Specifying the Font Size
Size is only a suggestion!
Using the font-size style attribute
Absolute measurement units
Relative measurement units
Determining Other Font Characteristics
Using font-style for italics
Using font-weight for bold
Using text-decoration
Using text-align for basic alignment
Other text attributes
Using the font shortcut
Working with subscripts and superscripts
Chapter 3: Selectors: Coding with Class and Style
Selecting Particular Segments
Defining more than one kind of paragraph
Styling identified paragraphs
Using Emphasis and Strong Emphasis
Modifying the Display of em and strong
Defining Classes
Adding classes to the page
Using classes
Combining classes
Introducing div and span
Organizing the page by meaning
Why not make a table?
Using Pseudo-Classes to Style Links
Styling a standard link
Styling the link states
Best link practices
Selecting in Context
Defining Styles for Multiple Elements
Using New CSS3 Selectors
Attribute selection
not
nth-child
Other new pseudo-classes
Chapter 4: Borders and Backgrounds
Joining the Border Patrol
Using the border attributes
Defining border styles
Using the border shortcut
Creating partial borders
Introducing the Box Model
Border, margin, and padding
Positioning elements with margins and padding
New CSS3 Border Techniques
Image borders
Adding Rounded Corners
Adding a box shadow
Changing the Background Image
Getting a background check
Solutions to the background conundrum
Manipulating Background Images
Turning off the repeat
Using CSS3 Gradients
Using Images in Lists
Chapter 5: Levels of CSS
Managing Levels of Style
Using local styles
Using an external style sheet
Understanding the Cascading Part of Cascading Style Sheets
Inheriting styles
Hierarchy of styles
Overriding styles
Precedence of style definitions
Managing Browser Incompatibility
Coping with incompatibility
Making Internet Explorer–specific code
Using a conditional comment with CSS
Checking the Internet Explorer version
Using a CSS reset
Chapter 6: CSS Special Effects
Image Effects
Transparency
Reflections
Text Effects
Text stroke
Text-shadow
Transformations and Transitions
Transformations
Three-dimensional transformations
Transition animation
Animations
Book III: Building Layouts with CSS
Chapter 1: Fun with the Fabulous Float
Avoiding Old-School Layout Pitfalls
Problems with frames
Problems with tables
Problems with huge images
Problems with Flash
Introducing the Floating Layout Mechanism
Using float with images
Adding the float property
Using Float with Block-Level Elements
Floating a paragraph
Adjusting the width
Setting the next margin
Using Float to Style Forms
Using float to beautify the form
Adjusting the fieldset width
Using the clear attribute to control page layout
Chapter 2: Building Floating Page Layouts
Creating a Basic Two-Column Design
Designing the page
Building the HTML
Using temporary background colors
Setting up the floating columns
Tuning up the borders
Advantages of a fluid layout
Using semantic tags
Building a Three-Column Design
Styling the three-column page
Problems with the floating layout
Specifying a min-height
Using height and overflow
Building a Fixed-Width Layout
Setting up the HTML
Fixing the width with CSS
Building a Centered Fixed-Width Layout
Making a surrogate body with an all div
How the jello layout works
Limitations of the jello layout
Chapter 3: Styling Lists and Menus
Revisiting List Styles
Defining navigation as a list of links
Turning links into buttons
Building horizontal lists
Creating Dynamic Lists
Building a nested list
Hiding the inner lists
Getting the inner lists to appear on cue
Building a Basic Menu System
Building a vertical menu with CSS
Building a horizontal menu
Chapter 4: Using Alternative Positioning
Working with Absolute Positioning
Setting up the HTML
Adding position guidelines
Making absolute positioning work
Managing z-index
Handling depth
Working with z-index
Building a Page Layout with Absolute Positioning
Overview of absolute layout
Writing the HTML
Adding the CSS
Creating a More Flexible Layout
Designing with percentages
Building the layout
Exploring Other Types of Positioning
Creating a fixed menu system
Setting up the HTML
Setting the CSS values
Flexible Box Layout Model
Creating a flexible box layout
Viewing a flexible box layout
… And now for a little reality
Determining Your Layout Scheme
Book IV: Client-Side Programming with JavaScript
Chapter 1: Getting Started with JavaScript
Working in JavaScript
Choosing a JavaScript editor
Picking your test browser
Writing Your First JavaScript Program
Embedding your JavaScript code
Creating comments
Using the alert() method for output
Adding the semicolon
Introducing Variables
Creating a variable for data storage
Asking the user for information
Responding to the user
Using Concatenation to Build Better Greetings
Comparing literals and variables
Including spaces in your concatenated phrases
Understanding the String Object
Introducing object-based programming (and cows)
Investigating the length of a string
Using string methods to manipulate text
Understanding Variable Types
Adding numbers
Adding the user's numbers
The trouble with dynamic data
The pesky plus sign
Changing Variables to the Desired Type
Using variable conversion tools
Fixing the addInput code
Chapter 2: Talking to the Page
Understanding the Document Object Model
Previewing the DOM
Getting the blues, JavaScript-style
Writing JavaScript code to change colors
Managing Button Events
Adding a function for more … functionality
Making a more flexible function
Embedding quotes within quotes
Writing the changeColor function
Managing Text Input and Output
Introducing event-driven programming
Creating the HTML form
Using getElementById to get access to the page
Manipulating the text fields
Writing to the Document
Preparing the HTML framework
Writing the JavaScript
Finding your innerHTML
Working with Other Text Elements
Building the form
Writing the function
Understanding generated source
What if you're not in Chrome?
Chapter 3: Decisions and Debugging
Making Choices with if
Changing the greeting with if
The different flavors of if
Conditional operators
Nesting your if statements
Making decisions with switch
Managing Repetition with for Loops
Setting up the web page
Initializing the output
Creating the basic for loop
Introducing shortcut operators
Counting backwards
Counting by fives
Understanding the Zen of for loops
Building while Loops
Making a basic while loop
Getting your loops to behave
Managing more complex loops
Managing Errors with a Debugger
Debugging with the interactive console
Debugging strategies
Resolving syntax errors
Squashing logic bugs
Chapter 4: Functions, Arrays, and Objects
Breaking Code into Functions
Thinking about structure
Building the antsFunction.html program
Passing Data to and from Functions
Examining the makeSong code
Looking at the chorus
Handling the verses
Managing Scope
Introducing local and global variables
Examining variable scope
Building a Basic Array
Accessing array data
Using arrays with for loops
Revisiting the ants song
Working with Two-Dimension Arrays
Setting up the arrays
Getting a city
Creating a main() function
Creating Your Own Objects
Building a basic object
Adding methods to an object
Building a reusable object
Using your shiny new objects
Introducing JSON
Storing data in JSON format
Building a more complex JSON structure
Chapter 5: Getting Valid Input
Getting Input from a Drop-Down List
Building the form
Reading the list box
Managing Multiple Selections
Coding a multiple selection select object
Writing the JavaScript code
Check, Please: Reading Check Boxes
Building the check box page
Responding to the check boxes
Working with Radio Buttons
Interpreting Radio Buttons
Working with Regular Expressions
Introducing regular expressions
Using characters in regular expressions
Marking the beginning and end of the line
Working with special characters
Conducting repetition operations
Working with pattern memory
New HTML5/CSS3 Tricks for Validation
Adding a pattern
Marking a field as required
Adding placeholder text
Chapter 6: Drawing on the Canvas
Canvas Basics
Setting up the canvas
How <canvas> works
Fill and Stroke Styles
Colors
Gradients
Patterns
Drawing Essential Shapes
Rectangle functions
Drawing text
Adding shadows
Working with Paths
Line-drawing options
Drawing arcs and circles
Drawing quadratic curves
Building a Bézier curve
Images
Drawing an image on the canvas
Drawing part of an image
Manipulating Pixels
Chapter 7: Animation with the Canvas
Transformations
Building a transformed image
A few thoughts about transformations
Animation
Overview of the animation loop
Setting up the constants
Initializing the animation
Animate the current frame
Moving an element
Bouncing off the walls
Reading the Keyboard
Managing basic keyboard input
Moving an image with the keyboard
Book V: Server-Side Programming with PHP
Chapter 1: Getting Started on the Server
Introducing Server-Side Programming
Programming on the server
Serving your programs
Picking a language
Installing Your Web Server
Inspecting phpinfo()
Building HTML with PHP
Coding with Quotation Marks
Working with Variables PHP-Style
Concatenation
Interpolating variables into text
Building HTML Output
Using double quote interpolation
Generating output with heredocs
Switching from PHP to HTML
Chapter 2: PHP and HTML Forms
Exploring the Relationship between PHP and HTML
Embedding PHP inside HTML
Viewing the results
Sending Data to a PHP Program
Creating a form for PHP processing
Receiving data in PHP
Choosing the Method of Your Madness
Using get to send data
Using the post method to transmit form data
Getting data from the form
Retrieving Data from Other Form Elements
Building a form with complex elements
Responding to a complex form
Chapter 3: Using Control Structures
Introducing Conditions (Again)
Building the Classic if Statement
Rolling dice the PHP way
Checking your six
Understanding comparison operators
Taking the middle road
Building a program that makes its own form
Making a switch
Looping with for
Looping with while
Chapter 4: Working with Arrays
Using One-Dimensional Arrays
Creating an array
Filling an array
Viewing the elements of an array
Preloading an array
Using Loops with Arrays
Simplifying loops with foreach
Arrays and HTML
Introducing Associative Arrays
Using foreach with associative arrays
Introducing Multidimensional Arrays
We're going on a trip
Looking up the distance
Breaking a String into an Array
Creating arrays with explode
Creating arrays with preg_split
Chapter 5: Using Functions and Session Variables
Creating Your Own Functions
Rolling dice the old-fashioned way
Improving code with functions
Managing variable scope
Returning data from functions
Managing Persistence with Session Variables
Understanding session variables
Adding session variables to your code
Chapter 6: Working with Files and Directories
Text File Manipulation
Writing text to files
Writing a basic text file
Reading from the file
Using Delimited Data
Storing data in a CSV file
Viewing CSV data directly
Reading the CSV data in PHP
Working with File and Directory Functions
opendir( )
readdir( )
chdir( )
Generating the list of file links
Chapter 7: Exceptions and Objects
Object-Oriented Programming in PHP
Building a basic object
Using your brand-new class
Protecting your data with access modifiers
Using access modifiers
You've Got Your Momma's Eyes: Inheritance
Building a critter based on another critter
How to inherit the wind (and anything else)
Catching Exceptions
Introducing exception handling
Knowing when to trap for exceptions
Book VI: Managing Data with MySQL
Chapter 1: Getting Started with Data
Examining the Basic Structure of Data
Determining the fields in a record
Introducing SQL data types
Specifying the length of a record
Defining a primary key
Defining the table structure
Introducing MySQL
Why use MySQL?
Understanding the three-tier architecture
Practicing with MySQL
Setting Up phpMyAdmin
Changing the root password
Adding a user
Using phpMyAdmin on a remote server
Implementing a Database with phpMyAdmin
Chapter 2: Managing Data with MySQL
Writing SQL Code by Hand
Understanding SQL syntax rules
Examining the buildContact.sql script
Dropping a table
Creating a table
Adding records to the table
Viewing the sample data
Running a Script with phpMyAdmin
Using AUTO_INCREMENT for Primary Keys
Selecting Data from Your Tables
Selecting only a few fields
Selecting a subset of records
Searching with partial information
Searching for the ending value of a field
Searching for any text in a field
Searching with regular expressions
Sorting your responses
Editing Records
Updating a record
Deleting a record
Exporting Your Data and Structure
Exporting SQL code
Creating XML data
Chapter 3: Normalizing Your Data
Recognizing Problems with Single-Table Data
The identity crisis
The listed powers
Repetition and reliability
Fields with changeable data
Deletion problems
Introducing Entity-Relationship Diagrams
Using MySQL Workbench to draw ER diagrams
Creating a table definition in Workbench
Introducing Normalization
First normal form
Second normal form
Third normal form
Identifying Relationships in Your Data
Chapter 4: Putting Data Together with Joins
Calculating Virtual Fields
Introducing SQL functions
Knowing when to calculate virtual fields
Calculating Date Values
Using DATEDIFF to determine age
Adding a calculation to get years
Converting the days integer into a date
Using YEAR() and MONTH() to get readable values
Concatenating to make one field
Creating a View
Using an Inner Join to Combine Tables
Building a Cartesian join and an inner join
Enforcing one-to-many relationships
Counting the advantages of inner joins
Building a view to encapsulate the join
Managing Many-to-Many Joins
Understanding link tables
Using link tables to make many-to-many joins
Chapter 5: Connecting PHP to a MySQL Database
PHP and MySQL: A Perfect (but Geeky) Romance
Understanding data connections
Introducing PDO
Building a connection
Retrieving data from the database
Using HTML tables for output
Allowing User Interaction
Building an HTML search form
Responding to the search request
Book VII: Integrating the Client and Server with AJAX
Chapter 1: AJAX Essentials
AJAX Spelled Out
A is for asynchronous
J is for JavaScript
A is for . . . and?
And X is for . . . data
Making a Basic AJAX Connection
Building the HTML form
Creating an XMLHttpRequest object
Opening a connection to the server
Sending the request and parameters
Checking the status
All Together Now — Making the Connection Asynchronous
Setting up the program
Building the getAJAX() function
Reading the response
Chapter 2: Improving JavaScript and AJAX with jQuery
Introducing jQuery
Installing jQuery
Importing jQuery from Google
Your First jQuery App
Setting up the page
Meet the jQuery node object
Creating an Initialization Function
Using $(document).ready()
Alternatives to document.ready
Investigating the jQuery Object
Changing the style of an element
Selecting jQuery objects
Modifying the style
Adding Events to Objects
Adding a hover event
Changing classes on the fly
Making an AJAX Request with jQuery
Including a text file with AJAX
Building a poor man's CMS with AJAX
Chapter 3: Animating jQuery
Playing Hide and Seek
Getting transition support
Writing the HTML and CSS foundation
Initializing the page
Hiding and showing the content
Toggling visibility
Sliding an element
Fading an element in and out
Changing Position with jQuery
Creating the framework
Setting up the events
Building the move() function with chaining
Building time-based animation with animate()
Move a little bit: Relative motion
Modifying Elements on the Fly
Building the basic page
Initializing the code
Adding text
Attack of the clones
It's a wrap
Alternating styles
Resetting the page
More fun with selectors and filters
Chapter 4: Using the jQuery User Interface Toolkit
What the jQuery User Interface Brings to the Table
It's a theme park
Using the themeRoller to get an overview of jQuery
Wanna drag? Making components draggable
Downloading the library
Writing the program
Resizing on a Theme
Examining the HTML and standard CSS
Importing the files
Making a resizable element
Adding themes to your elements
Adding an icon
Dragging, Dropping, and Calling Back
Building the basic page
Initializing the page
Handling the drop
Beauty school dropout events
Cloning the elements
Chapter 5: Improving Usability with jQuery
Multi-Element Designs
Playing the accordion widget
Building a tabbed interface
Using tabs with AJAX
Improving Usability
Playing the dating game
Picking numbers with the slider
Selectable elements
Building a sortable list
Creating a custom dialog box
Chapter 6: Working with AJAX Data
Sending Requests AJAX Style
Sending the data
Building a Multipass Application
Setting up the HTML framework
Loading the select element
Writing the loadList.php program
Responding to selections
Writing the showHero.php script
Working with XML Data
Review of XML
Manipulating XML with jQuery
Creating the HTML
Retrieving the data
Processing the results
Printing the pet name
Working with JSON Data
Knowing JSON's pros
Reading JSON data with jQuery
Managing the framework
Retrieving the JSON data
Processing the results
Chapter 7: Going Mobile
Thinking in Mobile
Building a Responsive Site
Specifying a media type
Adding a qualifier
Making Your Page Responsive
Building the wide layout
Adding the narrow CSS
Using jQuery Mobile to Build Mobile Interfaces
Building a basic jQuery mobile page
Working with collapsible content
Building a multi-page document
Going from Site to App
Adding an icon to your program
Removing the Safari toolbar
Storing your program offline
Book VIII: Moving from Pages to Sites
Chapter 1: Managing Your Servers
Understanding Clients and Servers
Parts of a client-side development system
Parts of a server-side system
Creating Your Own Server with XAMPP
Running XAMPP
Testing your XAMPP configuration
Adding your own files
Setting the security level
Compromising between functionality and security
Choosing a Web Host
Finding a hosting service
Connecting to a hosting service
Managing a Remote Site
Using web-based file tools
Understanding file permissions
Using FTP to manage your site
Using an FTP client
Naming Your Site
Understanding domain names
Registering a domain name
Managing Data Remotely
Creating your database
Finding the MySQL server name
Chapter 2: Planning Your Sites
Creating a Multipage Website
Planning a Larger Site
Understanding the Client
Ensuring that the client's expectations are clear
Delineating the tasks
Understanding the Audience
Determining whom you want to reach
Finding out the user's technical expertise
Building a Site Plan
Creating a site overview
Building the site diagram
Creating Page Templates
Sketching the page design
Building the HTML template framework
Creating page styles
Building a data framework
Fleshing Out the Project
Making the site live
Contemplating efficiency
Chapter 3: Introducing Content Management Systems
Overview of Content Management Systems
Previewing Common CMSs
Moodle
WordPress
Drupal
Building a CMS site with WebsiteBaker
Installing your CMS
Getting an overview of WebsiteBaker
Adding your content
Using the WYSIWYG editor
Changing the template
Adding additional templates
Adding new functionality
Building Custom Themes
Starting with a prebuilt template
Changing the info.php file
Modifying index.php
Modifying the CSS files
Packaging your template
Chapter 4: Editing Graphics
Using a Graphics Editor
Choosing an Editor
Introducing Gimp
Creating an image
Painting tools
Selection tools
Modification tools
Managing tool options
Utilities
Understanding Layers
Introducing Filters
Solving Common Web Graphics Problems
Changing a color
Building a banner graphic
Building a tiled background
Chapter 5: Taking Control of Content
Building a “Poor Man's CMS” with Your Own Code
Using Server Side Includes (SSIs)
Using AJAX and jQuery for client-side inclusion
Building a page with PHP includes
Creating Your Own Data-Based CMS
Using a database to manage content
Writing a PHP page to read from the table
Allowing user-generated content
Adding a new block
Improving the dbCMS design
About the Author
Cheat Sheet
More Dummies Products
Guide
Table of Contents
Begin Reading
Pages
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
51
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
98
99
100
101
102
103
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
129
130
131
132
133
134
135
137
138
139
141
142
143
144
145
146
147
148
149
150
151
152
153
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
Add Highlight
No Comment
..................Content has been hidden....................
You can't read the all page of ebook, please click
here
login for view all page.
Day Mode
Cloud Mode
Night Mode
Reset