Thông tin tài liệu
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
201 West 103rd St., Indianapolis, Indiana, 46290 USA
Teach Yourself
in
24
Hours
Kynn Bartlett
CSS
01 0672324091FM 6/13/02 10:40 AM Page i
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Sams Teach Yourself CSS in 24 Hours
Copyright © 2002 by Sams Publishing
All rights reserved. No part of this book shall be reproduced, stored in a
retrieval system, or transmitted by any means, electronic, mechanical, photo-
copying, recording, or otherwise, without written permission from the publisher.
No patent liability is assumed with respect to the use of the information contained
herein. Although every precaution has been taken in the preparation of this
book, the publisher and author assume no responsibility for errors or omissions.
Nor is any liability assumed for damages resulting from the use of the information
contained herein.
International Standard Book Number: 0-672-32409-1
Library of Congress Catalog Card Number: 2002100942
Printed in the United States of America
First Printing: July 2002
Second printing with corrections: December 2002
05 04 03 02 4 3 2
Trademarks
All terms mentioned in this book that are known to be trademarks or service
marks have been appropriately capitalized. Sams Publishing cannot attest to the
accuracy of this information. Use of a term in this book should not be regarded
as affecting the validity of any trademark or service mark.
Warning and Disclaimer
Every effort has been made to make this book as complete and as accurate as
possible, but no warranty or fitness is implied. The information provided is on
an “as is” basis. The author and the publisher shall have neither liability nor
responsibility to any person or entity with respect to any loss or damages aris-
ing from the information contained in this.
ACQUISITIONS EDITOR
Jill Hayden
DEVELOPMENT EDITOR
Susan Hobbs
MANAGING EDITOR
Charlotte Clapp
PROJECT EDITOR
Matthew Purcell
COPY EDITOR
Michael Kopp
(Publication Services, Inc.)
INDEXER
Jessica Matthews
(Publication Services, Inc.)
PRODUCTION EDITOR
Theodore Young, Jr.
(Publication Services, Inc.)
PROOFREADER
Phil Hamer
(Publication Services, Inc.)
TECHNICAL EDITOR
Marshall Jansen
TEAM COORDINATOR
Amy Patton
MULTIMEDIA DEVELOPER
Dan Scherf
INTERIOR DESIGNER
Gary Adair
COVER DESIGNER
Aren Howell
PAGE LAYOUT
Jennifer Faaborg
Michael Tarleton
James Torbit
(Publication Services, Inc.)
01 0672324091FM 12/3/02 12:13 PM Page ii
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Contents at a Glance
Introduction 1
Part I Introduction to Cascading Style Sheets 7
Hour 1 Understanding Cascading Style Sheets 9
2 Getting Started with CSS 21
3Browser Support for CSS 41
4Using CSS with HTML 61
Part II Core Principles of CSS 79
Hour 5 Selectors 81
6The CSS Box Model 103
7 Cascading and Inheritance 115
Part III Styling with CSS 129
Hour 8 Fonts and Font Families 131
9Text Colors and Effects 155
10 Backgrounds and Background Colors 167
11 Styling Links 185
12 Alignment and Spacing 199
13 Borders and Boxes 217
14 Lists 233
15 Styling Tables 247
16 Page Layout in CSS 271
17 Advanced CSS Layout 299
18 Web Design with CSS 323
Part IV Advanced Cascading Style Sheets 341
Hour 19 Advanced Selectors 343
20 CSS for Printing 357
21 Accessibility and Internationalization 371
22 User Interface and Generated Content 387
01 0672324091FM 6/13/02 10:40 AM Page iii
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Hour 23 CSS and JavaScript 407
24 CSS and XML 429
Part V Appendixes 451
Appendix A How to Read W3C Recommendations 453
BReplacing Presentational HTML with CSS 459
CGlossary 463
Index 471
01 0672324091FM 6/13/02 10:40 AM Page iv
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Contents
Introduction 1
Part I Introduction to Cascading Style Sheets 7
Hour 1 Understanding Cascading Style Sheets 9
What Are Cascading Style Sheets? 10
Defining Style Sheets 10
Defining Cascading 10
The Origin of Cascading Style Sheets 11
The CSS Specifications 12
Other Style Languages 13
CSS in Web Design 13
How CSS Is Used 14
What CSS Can Do 16
What CSS Can’t Do 17
When to Use CSS 18
Browser Support 18
Workarounds for Browser Limitations 18
Summary 18
Q&A 19
Workshop 20
Quiz 20
Answers 20
Hour 2 Getting Started with CSS 21
Creating a Style Sheet 21
Software Tools for CSS 22
Naming and Saving a Style Sheet 25
Writing CSS Rules 25
The Basic Structure of a CSS Rule 25
Combining CSS Rules 27
CSS Comments 28
Simple CSS Properties for Text Formatting 29
Linking a Style Sheet to an HTML Page 32
A Simple HTML Page for Styling 32
Linked Style Sheets in HTML 35
Adding More Styles 35
Viewing Your Style Sheet 37
Recommended Browsers 37
01 0672324091FM 6/13/02 10:40 AM Page v
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
vi Sams Teach Yourself CSS in 24 Hours
Summary 37
Q&A 38
Workshop 38
Quiz 38
Answers 39
Activity: Create Your First Style Sheet 39
Hour 3 Browser Support for CSS 41
The Browser Problem 42
How Browsers Deal with CSS 42
The Importance of Workarounds 45
Browser Compatibility Charts 46
Web Standards and You 46
CSS Support in Current Browsers 47
Internet Explorer 48
Netscape 50
Opera 51
Other Browsers 53
Summary 56
Browser Support Report Card 57
Q&A 58
Workshop 59
Quiz 59
Answers 59
Activity: Browser Test-drive 59
Hour 4 Using CSS with HTML 61
Types of HTML 62
HTML 4.01 62
XHTML 64
Validating HTML 64
Style Sheets in HTML 65
Linked Style Sheets 65
Embedded Style Sheets 68
Inline Style Attributes 70
Classes and IDs 71
The
class Attribute in HTML 72
Class Selectors in CSS 73
The
id Attribute in HTML 75
id Selectors in CSS 75
Summary 76
Browser Support Report Card 76
Q&A 76
01 0672324091FM 6/13/02 10:40 AM Page vi
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Workshop 77
Quiz 77
Answers 77
Activity: Using HTML and CSS Together 78
Part II Core Principles of CSS 79
Hour 5 Selectors 81
Simple Selectors 81
Using class and id Selectors 82
The Universal Selector 85
Combining Simple Selectors 86
Grouping Selectors 86
Descendant Selectors 87
Pseudo-classes and Pseudo-elements 91
Simple Pseudo-classes 92
Pseudo-elements in CSS 97
Summary 100
Browser Support Report Card 100
Q&A 101
Workshop 101
Quiz 101
Answers 101
Activity 102
Hour 6 The CSS Box Model 103
Displaying Content in CSS 103
Types of Elements 104
The
display Property 105
Understanding the Box Model 106
Documents as Trees 107
Documents as Boxes 108
Box Display Properties 109
The
margin Property 110
The
border Property 111
The
padding Property 111
Summary 112
Browser Support Report Card 112
Q&A 113
Workshop 113
Quiz 113
Answers 114
Contents vii
01 0672324091FM 6/13/02 10:40 AM Page vii
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
viii Sams Teach Yourself CSS in 24 Hours
Hour 7 Cascading and Inheritance 115
How the Cascade Works 116
Order of the Cascade 118
Cascading and HTML Attributes 119
Using
!important in Rules 120
User-defined Style Sheets 121
Importing CSS 122
The
@import Rule 123
Inheritance 124
Inherited Values 125
Calculated Values 125
Specifying Inheritance 125
Summary 125
Browser Support Report Card 126
Q&A 126
Workshop 127
Quiz 127
Answers 127
Activity 128
Part III Styling with CSS 129
Hour 8 Fonts and Font Families 131
Specifying Font Properties 131
The font-weight Property 132
The
font-variant Property 135
The
font-style Property 136
The
font-stretch Property 137
The
font-size-adjust Property 138
The
font Shorthand Property 140
Font Families 141
The Generic Font Families 141
Commonly Installed Fonts 148
Downloadable Fonts and Font Descriptors 149
Browser Support for Downloadable Fonts 150
Summary 150
Browser Support Report Card 151
Q&A 151
Workshop 151
Quiz 151
Answers 152
Activity 153
01 0672324091FM 6/13/02 10:40 AM Page viii
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
Hour 9 Text Colors and Effects 155
Text Colors 155
Specifying Color Values 156
Using Color Effectively 158
Special Text Effects 159
The
text-decoration Property 159
The
text-transform Property 162
The
text-shadow Property 163
Summary 164
Browser Support Report Card 165
Q&A 165
Workshop 165
Quiz 165
Answers 166
Activity 166
Hour 10 Backgrounds and Background Colors 167
Setting Background Color 168
The
background-color Property 168
Using Background Images 170
The
background-image Property 171
The
background-repeat Property 174
The
background-position Property 177
The
background-attachment Property 180
The
background Shorthand Property 182
Summary 182
Browser Support Report Card 182
Q&A 183
Workshop 183
Quiz 183
Answers 184
Activity 184
Hour 11 Styling Links 185
CSS for Link Styling 185
The
:link and :visited Pseudo-classes 186
The
:active Pseudo-class 187
The
:hover Pseudo-class 188
The
:focus Pseudo-class 190
Common Link-styling Techniques 191
Replacing HTML
<body> Attributes 191
Removing Underlines 192
Mouseover Effects 193
Contents ix
01 0672324091FM 6/13/02 10:40 AM Page ix
Please purchase PDF Split-Merge on www.verypdf.com to remove this watermark.
[...]... webdev@samspublishing.com Mail: Mark Taber Associate Publisher Sams Publishing 800 East 96th Street Indianapolis, IN 4 6240 USA Reader Services For more information about this book or any other Sams Publishing title, visit our Web site at www.samspublishing.com Type either the ISBN (excluding hyphens) or the title of a book into the Search field to find the page you’re looking for Introduction Way back in. .. book, Sams Teach Yourself CSS in 24 Hours, comes with a promise to you, the reader The promise is that in 24 hours—or less—I’ll have you up and running with CSS, producing your own style sheets that rival those of Web grandmasters To do this, I’ve broken down that 24- hour period into 24 lessons of one hour or less Now, let’s be honest—you really should not try to do everything in the book in 24 hours... fonts CSS Level 2 includes and extends all properties and values defined in CSS Level 1 In this book, I won’t make a distinction between a property that originated in CSS Level 1 and CSS Level 2; Level 2 is the current standard and the definitions in CSS2 supercede those in CSS1 Other Style Languages CSS isn’t the only style language, but it’s the primary one used on the Web Some other style languages include... called CSS- P—were introduced in CSS Level 1 and allow you Understanding Cascading Style Sheets to format a Web page without using tables Some of the things you can do with CSS to affect the graphical layout of the page include • Setting a background graphic and controlling its location, tiling, and scrolling • Drawing borders and outlines around sections of a page • Setting vertical and horizontal margins... as a CSS editor; as I’m assuming you can create HTML files, anyone reading this book should have access to a text editor In Hour 2, I’ll give you some specific pointers to CSS editors The CSSin24hours.com Web Site This book has a companion site maintained by the author—that’s me—at http://www.CSSin24hours.com/ At that site, you’ll find • Downloadable copies of all code samples in the book • Live links... “Danger, Will Robinson!” warning alarm If there’s a possibility of you turning down the wrong path, I’ll be there to steer you clear of it 5 6 Sams Teach Yourself CSS in 24 Hours Ready, Set, Go! Are you eager to start? Ready your browser, sit yourself in front of your computer in a comfortable position, and go on to the first hour! Let me know how well you’ve done at teaching yourself Cascading Style Sheets;... centered in a box with a thin outline You can do some of this in HTML using tags and various attributes, but that can get cumbersome and difficult to maintain When you define your presentation styles in CSS, it becomes quick and easy to apply new styles that can affect all styles on a page or even the whole site—without having to edit the source HTML at all! Defining Cascading The term “Cascading” in. .. Cascading Style Sheets specifications The following 3 4 Sams Teach Yourself CSS in 24 Hours browsers are recommended; you should have at least one of the following browsers installed on your system: • Internet Explorer 6.0 (or higher) for Windows (http://www.microsoft.com/ windows/ie/) • Internet Explorer 5.1 (or higher) for Macintosh (http://www.microsoft.com/mac/) • Netscape 6.2.1 (or higher) for Windows,... underlining • Indenting or centering text • Stretching and adjusting text size and line spacing • Transforming sections of text to upper-, lower-, or mixed-case • Adding drop-capitals and other special effects These are all accomplished by creating CSS rules to set properties on text Graphical Appearance and Layout CSS can also be used to change the look of the entire page CSS properties for positioning—sometimes... 357 Categories of Media Types 358 Linking and Importing Media-specific Style Sheets 359 Using the @media Rule 360 CSS Properties for the print Medium 361 Browsers and Printing 361 Measurements for Printing 361 Defining the Page with @page 362 Setting Page Breaks 364 Designing CSS for Print 366 Summary 367 Browser . Property 244
Summary 245
Browser Support Report Card 245
Q&A 245
Workshop 246
Quiz 246
Answers 246
Activity 246
Hour 15 Styling Tables 247
Table Formatting. Sheets 10
Defining Cascading 10
The Origin of Cascading Style Sheets 11
The CSS Specifications 12
Other Style Languages 13
CSS in Web Design 13
How CSS Is Used
Ngày đăng: 21/01/2014, 16:20
Xem thêm: Tài liệu Sams Teach Yourself CSS in 24 Hours- P1 doc, Tài liệu Sams Teach Yourself CSS in 24 Hours- P1 doc