Cascading style sheets (CSS) are the modern standard for website
presentation. When combined with a structural markup language such
as HTML, XHTML, or XML (though not limited to these), cascading
style sheets provide Internet browsers with the information that
enables them to present all the visual aspects of a web document.
Cascading style sheets apply things such as borders, spacing
between paragraphs, headings or images, control of font faces or
font colors, background colors and images, textual effects such as
underlined or strike-through text, layering, positioning, and a
number of other presentational effects. CSS controls the
presentational aspects of a web page''s design, whereas HTML,
XHTML, or XML controls the structure of a web page, which means
little more than determining that certain text is a heading, other
text is a paragraph, still other text is a list of hyperlinks, and
so on. CSS provides enhanced and precise visual rendering; markup
languages such as HTML provide meaning and structure.
Beginning CSS: Cascading Style Sheets for Web Design, Second
Edition covers all the details required to combine CSS with
HTML, XHTML, or XML to create rich, aesthetically powerful designs.
Throughout the book, you'll focus on combining CSS with XHTML
specifically because XHTML is the standard hailed by Internet
standards bodies as the successor to HTML and the present and
future of website design. CSS and XHTML allow a web document to be
presented with less code, resulting in a significantly smaller file
size and greatly increased ease of maintenance. CSS also enables
the presentation of a web document to be centralized, which allows
for the look and feel of an entire website to be written and
centralized in one or a few simple documents, which makes updating
a website a breeze. With only a few simple edits to a single
document, the look and feel of an entire website can be completely
changed.
By using modern standards like CSS and XHTML, you can
drastically reduce the cost of building and maintaining a website
when compared to legacy HTML-only pages. You can also greatly
reduce the amount of physical bandwidth and hard disk space
required, resulting in immediate long-term benefits for any
website.
This book also discusses how to style XML documents with CSS-XML
being a more advanced markup language with multipurpose
applications. XML will play an increasingly larger role in the
production of XHTML documents in the future.
This second edition of Beginning CSS features a
near-complete overhaul of the content from the first edition.
Changes based on what readers had to say about the first edition
helped to create the most comprehensive introduction on CSS
available on the market. Throughout this book, you see CSS broken
down into simple examples that focus on a single concept at a time.
This allows you to better understand how and why something works,
since you aren''t presented with a lot of irrelevant code, and you
can better see the bits and pieces that come together that make
something work. While these examples may not be particularly
pretty, they are extremely valuable learning tools that will help
you master cascading style sheets.
To enhance the learning experience, most of the source code
examples are presented in syntax-colored code, a special feature in
this book. Syntax coloring is a feature that you commonly see in
fancy development software, such as Zend Studio (used to develop
PHP), or Microsoft''s Visual Studio (used to develop ASP, C#, and
so on), and other software used by professional programmers every
day. Syntax coloring is used in these software suites to make
programming easier and more intuitive, and it offers tremendous
benefits in teaching as well. It allows you to see what the
different bits and pieces are in source code, since each of the
different bits and pieces has a different coloring to identify its
purpose. It helps you to distinguish the building blocks of code
more easily, and if you use similar development software to write
your CSS and HTML documents, you''ll also find that you make fewer
mistakes and typos, since syntax coloring also helps you to write
code that is more bug free.
Many of the source code examples feature annotations to
highlight important, not-to-be-forgotten bits of information, and
to visually point out concepts that are discussed in the
surrounding text.
This edition also features every screenshot from a browser in
color, a first for Wrox. Presenting the browser screenshots in
color makes it easier for you to compare your results with what you
see in the book.
This book also approaches CSS development from a browser-neutral
point of view, and provides all the information that you need to
get a good healthy start on professional cross-browser,
cross-platform website design with IE 6, IE 7, Firefox 2, Opera 9,
and Safari 2, which will allow you to reach over 99 percent of the
web browsing public.
You also see comprehensive coverage of bugs, and workarounds for
the IE 6 and IE 7 web browsers. Long a thorn in the side of CSS
developers, making CSS work in IE 6 can be quite a chore without
detailed knowledge of its quirks and shortcomings. This book covers
many of the hacks and nonstandard workarounds that you may need to
develop compatible CSS content in IE 6. IE 7 features many great
improvements to CSS support, and though they are much fewer than
its predecessor, you still need a few tricks to make your web page
shine in Microsoft''s latest browser. It covers the workarounds
that you''ll need to make your pages work just as well in IE 7 as
they do in all the other popular browsers. In addition, you''ll
find the quick reference in Appendix B updated to reflect all of IE
7''s new CSS support.
Along with better coverage of Internet Explorer, there's greatly
improved coverage of Mac OS X browsers, Safari, Firefox, and Opera.
You''ll see that Mac browsers are equally represented among their
Windows brethren.
Whom Is This Book For? This book''s primary
audience is anyone seeking to learn how to use cascading style
sheets to present web documents. Because cascading style sheets are
used to control the presentational layout of a web document, people
from backgrounds in art, graphic design, or those who prepare print
layouts for publishing will feel at home using CSS. Regardless of
your background, CSS is a simple and powerful language designed so
that anyone can understand and use it.
To get the most out of this book, you need some experience with
markup languages like HTML or XHTML. If you are completely new to
website design and development, you should begin learning web
programming with Jon Duckett''s Beginning Web Programming with
HTML, XHTML, and CSS. Jon Duckett''s book provides a complete
overview of website development and design for the complete
beginner, whereas Beginning CSS: Cascading Style Sheets for Web
Design, Second Edition focuses specifically on the role of CSS
in website design.
This book presents all of the material you need to become
comfortable with writing CSS from scratch.
What Does This Book Cover? This book covers
portions of the CSS Level 1, 2, 2.1, and 3 specifications. These
specifications are created by an independent, not-for-profit
Internet standards organization called the World Wide Web
Consortium (W3C) that plans and defines how Internet documents
work. The majority of the book is written using what is defined in
the CSS Level 2.1 specification.
This book leads you through how to write CSS so that it is
compatible with all of the most popular web browsers, focused on
all of the following popular browsers:
* Microsoft Internet Explorer 6 for Windows
* Windows Internet Explorer 7 for Windows XP Service Pack 2,
Windows Server 2003, Windows XP Professional 64 bit, and Windows
Vista
* Safari 2 for Mac OS X 10.4 (Tiger)
* Mozilla Firefox 2 for Mac OS X, Windows, and Linux
* Opera 9 for Mac OS X, Windows, and Linux
The preceding browsers make up over 99 percent of the web
browser market share at the time of this writing. For your
convenience, this book also includes an integrated CSS feature
reference throughout the book, as well as notes on browser
compatibility. A CSS reference is also included in Appendix B.
How This Book Is Structured: This book is
divided into three parts. The following explains each of these
three parts in detail, and what each chapter covers.
Part I: The Basics: Throughout Chapters 1
through 4 you learn the founding principles of CSS-based web
design.
* Chapter 1, "Introducing Cascading Style Sheets":
This chapter talks about what CSS is, why it exists, who created
it, where it is maintained, and how it has evolved. It also
discusses some of the basic differences among the various CSS
specifications-CSS Level 1, CSS Level 2, CSS Level 2.1, and CSS
Level 3-and how these specifications define what CSS is. You also
learn more about each of the most popular browsers in use today,
how to obtain them, and write your first CSS-enabled document. It
also shows you how to install Internet Explorer 6 and Internet
Explorer 7 side-by-side on the same computer for testing.
* Chapter 2, "The Essentials": This chapter
introduces the basics of CSS. Now that you have seen an example CSS
document, this chapter introduces CSS rules and how selectors and
declarations are combined to create rules. It demonstrates the
various methods used to include CSS in a document. It explains how
keywords are used in CSS to create predefined behavior, and how
strings are used in CSS to refer to font names in a style sheet. It
presents the various units of measurement that CSS supports.
Finally, it talks about the different ways of specifying color.
* Chapter 3, "Selectors": Chapter 2 introduced the
concept of selectors. Chapter 3 talks about complex selectors, and
how you apply style to a portion of a document based on its context
within the document or user-initiated events.
* Chapter 4, "The Cascade and Inheritance": In
Chapter 4, you learn about how to override styles, how precedence
works in a style sheet, and how some styles can be considered more
important than others, concepts that come together to define the
cascade in cascading style sheets. You also learn
how once you set some styles in a document, those styles can be
inherited to other parts of a document depending on the context in
which they are applied.
Part II: Properties: Throughout Chapters 5
through 12, you learn about properties that are used to manipulate
the presentation of a document.
* Chapter 5, "Text Manipulation": Chapter 5,
presents the various properties that CSS provides for text
manipulation. These properties provide effects such as controlling
the amount of space between the letters of words, controlling the
amount of space between the words of a paragraph, controlling text
alignment, underlining, overlining, or strike-through text. It also
shows how to control the case of text by making text all lowercase,
uppercase, or capitalized.
* Chapter 6, "Fonts": After you have seen the
properties that CSS provides for text manipulation in Chapter 5,
Chapter 6 presents the CSS properties you can use to manipulate the
presentation of fonts. These effects include applying bold text,
setting a font face, setting the font size, setting an italic font,
as well as learning to use a property that enables you to specify
all CSS''s font effects in one single property.
* Chapter 7, "The Box Model": Chapter 7 elaborates
on a design concept fundamental to CSS design: The Box Model. You
learn how the box model plays an important role in determining
layout dimensions. Using the margin, border, padding, width, and
height properties, you can control how much space elements within a
document occupy, how much space separates them, whether there are
borders around them, whether scroll bars should be included. It
also discusses a CSS phenomenon known as margin collapsing, which
is what happens when top or bottom margins come into direct contact
with other top or bottom margins in a web document.
* Chapter 8, "CSS Buoyancy: Floating and Vertical
Alignment": Chapter 8, discusses float and
clear, two properties used to control the flow of
layout in a web document and often used to flow text beside images.
It also discusses the vertical-align property, which
is used to create effects like subscript or superscript text, as
well as to control vertical alignment in table cells.
* Chapter 9, "List Properties": In this chapter,
you'll look at the properties CSS provides to control presentation
of ordered and unordered lists. This discussion includes the
options CSS provides for predefined list markers, custom list
markers, and the position of list markers.
* Chapter 10, "Backgrounds": Chapter 10, presents
the properties CSS provides to control backgrounds in a web page.
This includes properties that set a background color or background
image, as well as those that control the position of a background,
the tiling of a background, and whether a background remains fixed
in place as a web page is scrolled or remains static. Finally, the
chapter shows you how to use a property that combines all these
individual effects into a single property.
* Chapter 11, "Positioning": You'll see four
different types of positioning: static, relative, absolute, and
fixed. You use positioning primarily to layer portions of a
document. It also describes some of the practical uses for
positioning, such as creating a multicolumn layout.
* Chapter 12, "Tables": Chapter 12, presents the
different properties that CSS provides for styling (X)HTML tables.
The properties presented in this chapter let you control the
spacing between the cells of a table, the placement of the table
caption, and whether empty cells are rendered. It also looks in
detail at the available tags and options that (X)HTML provides for
structuring tabular data.
Part III: Advanced CSS and Alternative Media:
Throughout Chapters 13, 14, and 15 you learn about how to use CSS
to make documents for printing, and another kind of document
altogether, XML.
* Chapter 13, "Styling for Print": This chapter
discusses what steps to take to use CSS to provide alternative
style sheets to create a printer-friendly version of a web
document.
* Chapter 14, "XML": In this chapter, you see how
you can use CSS to style XML content. This chapter focuses
specifically on the CSS display property and how you
use this property to change the behavior of tags in an XML or
HTML/XHTML document.
* Chapter 15, "The Cursor Property": Here you see
how you can change the user''s mouse cursor using CSS, how you can
customize the mouse cursor, and what browsers support which cursor
features.
* Chapter 16, "Dean Edwards's 'IE7'": This chapter
talks about one alternative to many of the hacks and workarounds
that you need for IE6. It talks about how to install an HTTP server
for your website, and how to install and use Dean Edwards''s "IE7"
JavaScript, which is a collection of IE6 hacks and workarounds
designed to make "IE6" feature compatible with its successor. This
chapter is available online only, on the Wrox website at
www.wrox.com/go/beginning_css2e.
* Appendixes: Appendix A contains the answers to
chapter exercises. Appendix B, "CSS Reference," provides a place
for you to look up CSS features and browser compatibility on the
fly. Appendix C, "CSS Colors," provides a reference of CSS named
colors. Appendix D, "Browser Rendering Modes," provides a reference
for the browser rendering modes invoked by the presence or absence
of a Document Type Declaration (discussed in Chapter 7).