CSS3: Visual QuickStart Guide, 5th Edition

With CSS3: Visual QuickStart Guide, readers can start with a tour of the stylesheet language, or skip ahead to any chapter of the book to look up specific tasks covering just what they need to know. This task-based, visual reference guide uses step-by-step instructions, and plenty of screenshots to teach beginning and intermediate users CSS. Best-selling author Jason Cranford Teague takes readers through today's CSS essentials and provides extensive coverage of CSS3 and CSS 2.1 techniques. The book outlines what can be done with CSS3 now and how the latest browsers have implemented many of the new features. Both beginning users, who want a thorough introduction to CSS, and more advanced users, who are looking for a convenient reference, will find what they need here in straightforward language and through readily accessible examples. Table of Contents 8 Introduction 16 Chapter 1 Understanding CSS3 24 What Is a Style? 25 What Are Cascading Style Sheets? 26 How does CSS work? 27 The Evolution of CSS 29 CSS Level 1 (CSS1) 30 CSS Level 2 (CSS2) 30 CSS Level 3 (CSS3) 30 CSS and HTML 31 Types of CSS Rules 32 The Parts of a CSS Rule 34 Browser CSS extensions 34 New in CSS3 36 Chapter 2 HTML5 Primer 38 What Is HTML? 39 Basic HTML Document Structure 40 HTML Properties 40 HTML and CSS 41 Types of HTML Elements 42 The Evolution of HTML5 45 And then came XHTML 45 The problem with XHTML2 46 And then there was HTML5 46 Is it HTML5 or XHTML5? 47 What's New in HTML5? 48 How Does HTML5 Structure Work? 49 Using HTML5 Structure Now 50 Making HTML5 work in Internet Explorer 53 Putting It All Together 55 Chapter 3 CSS Basics 56 The Basic CSS Selectors 57 Inline: Adding Styles to an HTML Tag 58 Embedded: Adding Styles to a Web Page 61 External: Adding Styles to a Web Site 64 Creating an external style sheet 64 Linking to a style sheet 67 Importing a style sheet 69 (Re)Defining HTML Tags 71 Defining Reusable Classes 74 Defining Unique IDs 78 Defining Universal Styles 82 Grouping: Defining Elements Using the Same Styles 85 Adding Comments to CSS 89 Putting It All Together 91 Chapter 4 Selective Styling 92 The Element Family Tree 93 Defining Styles Based on Context 94 Styling descendents 94 Styling only the children 97 Styling siblings 99 Working with Pseudo-classes 103 Styling links 105 Styling for interaction 109 NEW IN CSS3: Styling specific children with pseudo-classes 111 Styling for a particular language 112 NEW IN CSS3: Not styling an element 114 Working with Pseudo-elements 115 Working with first letters and lines 115 Setting content before and after an element 117 Defining Styles Based on Tag Attributes 119 NEW IN CSS3: Querying the Media 123 Media queries 123 Using the @media rule 129 Inheriting Properties from a Parent 132 Managing existing or inherited property values 133 Making a Declaration !important 134 Determining the Cascade Order 136 Putting It All Together 139 Chapter 5 Font Properties 140 Understanding Typography on the Web 142 Specifying the character set 142 Generic font families 143 Dingbats 145 HTML character entities 146 Setting a Font-Stack 147 Finding Fonts 149 Web-safe fonts 149 Downloadable Webfonts 150 Setting a better font stack 151 Setting the Font Size 156 NEW IN CSS3: Adjusting Font Size for Understudy Fonts 159 Making Text Italic 162 Setting Bold, Bolder, Boldest 165 Creating Small Caps 167 Setting Multiple Font Values 169 Putting It All Together 173 Chapter 6 Text Properties 174 Adjusting Text Spacing 176 Adjusting the space between letters (tracking) 176 Adjusting space between words 178 Adjusting space between lines of text (leading) 179 Setting Text Case 181 NEW IN CSS3: Adding a Text Drop Shadow 183 Aligning Text Horizontally 185 Aligning Text Vertically 187 Indenting Paragraphs 190 Controlling White Space 192 Decorating Text 195 Coming Soon! 198 Putting It All Together 200 Chapter 7 Color and Background Properties 202 Choosing Color Values 204 Color keywords 204 RGB hex values 205 RGB decimal values 205 Percentage values 206 New in CSS3: HSL values 206 New in CSS3: Color alpha values 206 New in CSS3: Color Gradients in Backgrounds 210 Internet Explorer gradients 210 Mozilla gradients 211 Webkit gradients 212 Choosing Your Color Palette 214 Color wheel basics 217 Online color scheme tools 218 Setting Text Color 219 Setting a Background Color 221 Setting a Background Image 223 Using Background Shorthand 231 Putting It All Together 235 Chapter 8 List and Table Properties 236 Setting the Bullet Style 239 Creating Your Own Bullets 240 Setting Bullet Positions 241 Setting Multiple List Styles 242 Setting the Table Layout 243 Setting the Space Between Table Cells 245 Collapsing Borders Between Table Cells 246 Dealing with Empty Table Cells 248 Setting the Position of a Table Caption 249 Putting It All Together 250 Chapter 9 User Interface and Generated Content Properties 252 Changing the Mouse Pointer Appearance 255 Adding Content Using CSS 257 Teaching the Browser to Count 259 Specifying the Quote Style 261 Putting It All Together 263 Chapter 10 Box Properties 264 Understanding an Element's Box 268 Parts of the box 269 Displaying an Element 271 Setting the Width and Height of an Element 274 Controlling Overflowing Content 277 Floating Elements in the Window 280 Clearing a floated element 281 Setting an Element's Margins 283 Setting an Element's Outline 286 Setting an Element's Border 288 NEW IN CSS3: Rounding Border Corners 291 NEW IN CSS3: Setting a Border Image 294 Setting an Element's Padding 297 Coming Soon! 299 Putting it All Together 300 Chapter 11 Visual Formatting Properties 302 Understanding the Window and Document 306 Setting the Positioning Type 308 Static positioning 308 Relative positioning 309 Absolute positioning 309 Fixed positioning 310 Setting an Element's Position 313 Stacking Objects in 3D 315 Setting the Visibility of an Element 317 Clipping an Element's Visible Area 319 NEW IN CSS3: Setting an Element's Opacity 321 NEW IN CSS3: Setting an Element's Shadows 323 Putting It All Together 325 Chapter 12 Transformation and Transition Properties 326 NEW IN CSS3: Transforming an Element 330 2D transformations 331 3D transformations 334 NEW IN CSS3: Adding Transitions Between Element States 339 What can be transitioned? 339 Putting It All Together 344 Chapter 13 Fixing CSS 346 Adjusting CSS for Internet Explorer 347 The underscore hack 348 IE conditional CSS 351 Fixing the Internet Explorer Box Model 356 Resetting CSS 358 A simple CSS reset 359 YUI2: Reset CSS 360 Eric Meyer's reset 361 Fixing the Float 363 Break tag clear all fix 363 Overflow fix 365 Chapter 14 Essential CSS Techniques 366 Creating Multicolumn Layouts with Float 369 Styling Links Versus Navigation 373 Using CSS Sprites 377 Creating a CSS Drop-down Menu 380 Chapter 15 Managing Style Sheets 384 Creating Readable Style Sheets 385 Include an introduction and TOC 385 Define colors, fonts, and other constants 385 Use section headers 387 The @ rules go at the top 387 Choose an organization scheme 388 Use specificity for hierarchy 389 CSS Libraries and Frameworks 390 Style Sheet Strategies 391 The One For All method 391 The Divide and Conquer method 392 The Aggregate method 393 The Dynamic method 394 Troubleshooting CSS Code 395 Ask these questions 395 If all else fails, try these ideas 398 Debugging CSS in Firebug and Web Inspector 399 Firebug for Firefox 400 Web Inspector in Safari and Chrome 402 Validating Your CSS Code 404 Minifying Your CSS 405 32 CSS Best Practices 408 Appendix A: CSS Quick Reference 416 Basic Selectors 417 Pseudo-Classes 418 Pseudo-Elements 418 Text Properties 419 Font Properties 420 Color and Background Properties 421 List Properties 422 Table Properties 422 User Interface and Generated Content Properties 423 Box Properties 424 Visual Formatting Properties 427 Transform Properties (-webkit-, -moz-, -o-) 428 Transition Properties (-webkit-, -moz-, -o-) 429 Appendix B: HTML and UTF Character Encoding 430 HTML and UTF Character Encoding 431 Index 436 A 436 B 437 C 438 D 441 E 442 F 443 G 444 H 444 I 445 J 446 K 446 L 446 M 447 N 447 O 447 P 448 Q 449 R 449 S 450 T 452 U 453 V 454 W 455 X 456 Y 456 Z 456 0321719638,9780321719638 Peachpit Press