Sunday 25th of February 2018 08:18:08 AM

Style Guide

CSS: Style Sheet Guidelines (3)

 

The Style Guide cannot possibly teach you all there is to know about CSS. But the following resources will get you up to speed:

  1. Online Guides & Articles
  2. Online Tools & Advanced Information
  3. Recommended Books
 

Online Guides & Articles

CSS Guide
John Allsopp’s complete online tutorial
Fear of Style Sheets
A gentle introduction from alistapart.com, plus tips on “no-fault CSS” to accommodate bad browsers (1998-1999)
Fear of Style Sheets 4
From alistapart.com, showing how type sizes fail in CSS and explaining why CSS pixels are the only sure means of controlling type size on the web; however, since CSS pixels can create an accessibility hazard ...
Size Matters
... Todd Fahrner, an invited expert to the W3C’s CSS Working Group, shows how to work around font–size keyword implementation flaws in Netscape 4 and IE4/5 (Win) to control type sizes while maintaining accessibility (from alistapart.com)
Little Boxes
Owen Briggs’s clickable CSS layouts (Open Source)
A Web Designer's Journey
From alistapart.com: showing how to design sites exclusively in CSS, work with the CSS box model, and use different types of links to turn off CSS in bad browsers
Practical CSS Layout Tips, Tricks, & Techniques
From alistapart.com: Mark Newhouse shows more ways to use CSS to replace (X)HTML tables
« Top
 

Online Tools & Advanced Information

CSS Validator
Check your Style Sheet for errors
1-click validators
One–click validation "bookmarklets" from David Lindquist
Favelets
Advanced CSS "bookmarklets" (IE only)
Web Review Master Compatibility Chart
More than you ever wanted to know about poor CSS support in browsers, compiled by Eric Meyer
SelectORacle
English translations of CSS–2 selectors (advanced)
Box Model Hack
Working around the flaws in IE5/Windows’s CSS Box Model (advanced)
« Top
 

Books

Cascading Style Sheets: Designing for the Web
by Håkon Wium Lie and Bert Bos (Addison-Wesley: 1997)
Though hardly recent (1997), this book has the advantage of having been written by world-class experts. Lie and Bos are W3C members, and Lie is widely considered “the father of CSS.”
Cascading Style Sheets: The Definitive Guide
by Eric Meyer (O'Reilly: 2001)
Eric Meyer is a world expert on CSS, an invited expert to the W3C's CSS Working Group, and currently serves as the Web standards evangelist for Netscape Communications (which is one reason Netscape 6.01 is so much better than Netscape 6.0). His book is both advanced and comprehensive.
Taking Your Talent to the Web
by Jeffrey Zeldman (New Riders: 2001)
Zeldman is a web designer, CSS advocate, and group leader of The Web Standards Project. His book is written for graphic designers and intermediate developers, and its chapter on CSS clarifies many issues while helping you avoid the snares of bad browsers. Disclosure: Zeldman helped prepare this Style Guide.
« Top

The next section presents Style Sheets for your use on NYPL projects. »

<P>The baseline of the <B>boldfaced text</B> is aligned with the baseline of this paragraph.</P>
Figure 4-30

Figure 4-30. Baseline alignment

In examining Fiture 4-30, you'll see that it doesn't look any different than you would expect. It shouldn't.

If a vertically aligned element doesn't have a baseline -- that is, if it's an image, a form input, or another replaced

« CSS Section Index | Steal These Style Sheets! »

real-world measures. Thus, when you display your document on a monitor, a ruler might reveal that the line height was not exactly four centimeters. For more details, see Chapter 3, "Units and Values".

Percentages, as well as em and ex, are calculated with respect to the element's font-size. Thus, this markup is relatively straightforward, as Figure 4-23 shows:

XML documents are easily committed to a persistence layer

XML documents may be stored in files or databases. When stored in files, XML documents are simply plain text files with tags (and possibly DTDs). It is very easy to save your XML documents to a text file and pass the text file around to other machines, platforms and programs (as long as they can understand the data). In the worst case scenario, XML documents (files) can be viewed in a text editor on just about any platform.

XML documents are also naturally committed to a database (relational or object) or any other kind of XML document store. There are commercial products available which allow you to save XML documents to an XML storage layer (which is not a database per se), like Datachannel's XStore and ODI's eXcelon. These XML store solutions are quite expensive ($10,000 to $20,000 range).

XML documents are also quite naturally retrieved from a persistence layer (databases, file systems, XML stores). This lends XML to be used in real world applications where the information being used by different parts of a system is the most important thing.

going to use the BODY attributes, you have to define them in each and every document. If you ever decide to change those values ...well, you have a lot of files to edit, don't you? On the other hand, if you set up these colors as an external style sheet, and then link all of your pages to the style sheet, then you only have to edit one file in order to change the text colors of every last one of your pages.

Of course, this is not always the case: you could set an explicitheight and let the width scale to fit the content. Thus:

top: 0; bottom: auto; left: auto; right: 0; width: auto; height: 10em;

Here the element will be 10 ems tall no matter what, but its widthcan vary to exactly fit the content. This is sometimes called"shrink-wrapping" thecontent, since it mimics the act of applying shrink-wrap to a box orother product. In the same way the plastic shrink-wrap precisely hugs