Cascading Style Sheets enable you to rapidly create web designs that can be shared by hundreds or even thousands of web pages. It accelerates development cycles by centralizing text and layout information for easy editing and updates. This book teaches you everything you need to know to start using CSS in your web development work, from the basics of marking up your content and styling text, through the creation of multi-column page layouts without the use of tables. Learn to create interface components, such as drop-down menus, navigation links, and animated graphical buttons, using only CSS (no JavaScript required). Discover how to design code that works on the latest standard-compliant browsers, such as IE7 and current versions of Firefox, Safari, and Opera, while working around the quirks of the older ones. With a mastery of CSS, your web design capabilities will move to a new level, and everything you need to know to get started and build your skills is right here in this book. You’ll be stylin’ in no time!
Author(s): Charles Wyke-Smith
Edition: 2
Publisher: New Riders Press
Year: 2007
Language: English
Pages: 313
Tags: Библиотека;Компьютерная литература;HTML / CSS / JavaScript;
Stylin’ with CSS: A Designer’s Guide, Second Edition......Page 1
Contents......Page 9
Introduction......Page 13
CHAPTER 1: XHTML: GIVING STRUCTURE TO CONTENT......Page 17
Even Today, IDWIMIE......Page 19
Content, Structure, and Presentation......Page 20
The Way We Were.........Page 22
The Future Just Happened......Page 24
XHTML and How To Write It......Page 25
XHTML—The Rules......Page 26
An XHTML Template......Page 31
Document Flow—Block and Inline Elements......Page 33
Document Hierarchy: Meet the XHTML Family......Page 39
CHAPTER 2: HOW CSS WORKS......Page 41
Inline Styles......Page 43
Embedded Styles......Page 44
Linked Styles......Page 45
Anatomy of a CSS Rule......Page 47
Writing CSS Rules......Page 48
Using Contextual Selectors......Page 49
Working with Child Selectors......Page 53
Adding Classes and IDs......Page 54
Introducing IDs......Page 58
The Difference Between IDs and Classes......Page 59
Specialized Selectors......Page 60
Summary of Selectors......Page 63
Anchor Link Pseudo-Classes......Page 64
Other Useful Pseudo-Classes......Page 66
Pseudo-Elements......Page 67
Inheritance......Page 69
Sources of Styles......Page 70
The Cascade Rules......Page 71
Numerical Values......Page 75
Color Values......Page 78
CHAPTER 3: STYLIN’ FONTS AND TEXT......Page 81
Specifying Fonts in CSS......Page 83
Introducing Font Collections......Page 84
Exploring Font Families......Page 86
Using Embedded Styles (for Now)......Page 88
Setting the Font Family for the Entire Page......Page 89
Sizing Fonts......Page 91
Inherited Styles in Nested Tags......Page 94
Font-Style Property......Page 96
Font-Weight Property......Page 97
Font-Variant Property......Page 98
Text Properties......Page 99
Text-Indent Property......Page 101
Letter-Spacing Property......Page 103
Word-Spacing Property......Page 104
Text-Decoration Property......Page 105
Text-Align Property......Page 106
Line-Height Property......Page 107
Text-Transform Property......Page 108
Vertical-Align Property......Page 109
Using Font and Text Styles......Page 111
CHAPTER 4: POSITIONING ELEMENTS......Page 115
Understanding the Box Model......Page 117
The Box Border......Page 118
The Box Margins......Page 121
Collapsing Margins......Page 123
How Big Is a Box?......Page 124
The Float Property......Page 129
The Clear Property......Page 131
Static Positioning......Page 135
Relative Positioning......Page 136
Absolute Positioning......Page 137
Fixed Positioning......Page 138
Positioning Context......Page 139
The Display Property......Page 142
Positioning/Display Example......Page 143
CHAPTER 5: BASIC PAGE LAYOUT......Page 149
Some Multi-Column Layouts......Page 151
Width Matters......Page 154
Floated Versus Absolutely-Positioned Layouts......Page 155
A Simple Two-Column Fixed-Width Layout......Page 156
Prevent Unwanted Overflow......Page 161
A Simple Two-Column Liquid Layout......Page 162
Use a Little Constraint......Page 164
To Float or Not To Float?......Page 165
A Three-Column Fixed-Width Layout......Page 166
A Three-Column Liquid Layout......Page 170
Making All the Columns the Same Length......Page 174
Faux Columns......Page 175
Programmatically Extend Columns (and Round Their Corners!)......Page 179
An Absolutely-Positioned Layout......Page 183
CHAPTER 6: DESIGNING INTERFACE COMPONENTS......Page 189
Styling Tables......Page 191
How Forms Work......Page 204
Form Markup......Page 205
Form Styling......Page 213
Lists......Page 220
Creating CSS-Based Menus......Page 232
CHAPTER 7: BUILDING WEB PAGES......Page 245
The Stylin’ Site......Page 247
Setting Up the Folder Structure......Page 249
Creating the Site Architecture......Page 251
The @import Rule......Page 254
The Text and Colors Style Sheet......Page 258
The Page Markup......Page 263
The Background Images......Page 266
The Drop-Down Menus......Page 269
The Transparent Sidebar Panel......Page 272
Adding the Registration Form......Page 277
Styling the Text......Page 280
Conclusion......Page 286
APPENDIX A: XHTML TAGS......Page 287
APPENDIX B: CSS PROPERTIES......Page 291
C......Page 305
E......Page 307
I......Page 308
M......Page 309
0–P......Page 310
S......Page 311
T......Page 312
X–Y–Z......Page 313
