HTML & CSS
Contents
Chapter 1: Structure
Chapter 2: Text
Chapter 3: Lists
Chapter 4: Links
Chapter 5: Images
Chapter 6: Tables
Chapter 7: Forms
Chapter 8: Extra Markup
Chapter 9: Flash, Video & Audio
Chapter 10: Introducing CSS
Chapter 11: Color
Chapter 12: Text
Chapter 13: Boxes
Chapter 14: Tables, Lists & Forms
Chapter 15: Layout
Chapter 16: Images
Chapter 17: HTML5 Layout
Chapter 1: Structure
Example
Body, Head and Title
First Test
View Source
back
Chapter 2: Text
Headings
Paragraphs
Bold
Italic
Superscript and Subscript
White Space
Line Breaks
Horizontal Rules
Strong
Emphasis
Quotations
Abbreviations
Citations
Definitions
Address
Insert and Delete
Strikethrough
Example
back
Chapter 3: Lists
Ordered Lists
Unordered Lists
Definition Lists
Nested Lists
Example
back
Chapter 4: Links
Writing Links
Linking to Other Sites
Linking to Other Pages
Email Links
Opening Links in a New Window
Linking to a Specific Part
Example
back
Chapter 5: Images
Adding Images
Height and Width of Images
Where to Place Images
Aligning Images Horizontally
Aligning Images Vertically
Examining Images on the Web
Figure and Figure Caption
Example
back
Chapter 6: Tables
Basic Table Structure
Table Headings
Spanning Columns
Spanning Rows
Long Tables
Width and Spacing
Border and Background
Example
back
Chapter 7: Forms
Form Structure
Text Input
Password Input
Textarea
Radio Button
Checkbox
Drop Down List Box
Multiple Select Box
File Input Box
Submit Button
Image Button
Button and Hidden Controls
Labelling Form Controls
Grouping Form Elements
HTML5 Form Validation
HTML5 Date Input
HTML5 Email Input
HTML5 URL Input
HTML5 Search Input
HTML5 Placeholder
Example
back
Chapter 8: Extra Markup
Comments in HTML
ID Attribute
Class Attribute
Block Elements
Inline Elements
Grouping Block Elements
Grouping Inline Elements
iFrames
iFrames (Continued)
Meta
Example
back
Chapter 9: Flash, Video & Audio
Adding a Flash Movie
Adding a Flash Video
Adding HTML5 Video
HTML5: Multiple Video Sources
Adding a Flash MP3 Player
Adding HTML5 Audio
HTML5: Multiple Audio Sources
Example
back
Chapter 10: Introducing CSS
Thinking Inside the Box (Borderless)
Thinking Inside the Box
Example
Example (CSS)
Using External CSS
Styles (CSS)
Using Internal CSS
CSS Selectors
How CSS Rules Cascade
Inheritance
back
Chapter 11: Color
Foreground Color
Background Color
Opacity
HSLA
Example
back
Chapter 12: Controlling Text
Font Family
Font Size
Font-Face
Understanding Font-Formats
Font Weight
Font Style
Text Transform
Text Decoration
Line Height
Letter and Word Spacing
Text Align
Vertical Align
Text Indent
Text Shadow
First Letter and Line
Link Visited
Hover Active Focus
Example
No Style
back
Chapter 13: Boxes
Width Height
Minimum Width Maximum Width
Minimum Height Maximum Height
Overflow
White Space Vertical Margin
White Space Vertical Margin (No space)
Border Width
Border Style
Border Color
Border Shorthand
Padding
Margin
Centering Content
Display
Visibility
Border Image
Box Shadow
Border Radius
Elliptical Shapes
Example
back
Chapter 14: Tables, Lists & Forms
List Style Type
List Style Image
List Style Position
List Style Shorthand
Table Properties
Empty Cells
Gaps Between Cells
Styling Text Inputs
Styling Submit Buttons
Styling Fieldsets and Legends
Aligning Form Controls: Problem
Aligning Form Controls: Solution
Cursor
Example
back
Chapter 15: Layout
Normal Flow
Relative Positioning
Absolute Positioning
Fixed Positioning
Overlapping Elements: Z-Index
Overlapping Elements: Without Z-Index
Floating Elements
Using Float to Place Elements Side-by-Side
Clearing Floats
Parents of Floated Elements: Problem
Parents of Floated Elements: Solution
Creating Multi-Column Layouts With Floats: Two Columns
Creating Multi-Column Layouts With Floats: Three Columns
A Fixed Width Layout
A Liquid Layout
A Grid-Based Layout Using 960.gs
Multiple Style Sheets: Import
Multiple Style Sheets: Link
Example
back
Chapter 16: Images
Controlling Sizes of Images in CSS
Aligning Images Using CSS
Centering Images Using CSS
Background Images: Body
Background Images: Element
Background Repeat
Background Attachment
Background Position
Background Position: Percentage
Background Shorthand
Image Rollovers and Sprites
CSS3: Gradients
Example
back
Chapter 17: HTML5 Layout
Example
back