|
|
|
|
Cascading Style SheetsCascading Style Sheets (CSS) work on the same premise as style sheets in print layout software programs: they allow you to manage the structure of the site separately from content. Text styles and content can be modified independently from each other, allowing developers to update web sites more efficiently. CSS enables you to improve the appearance of your site, and can be created with the same simple text editors as html. "Cascading" refers to a system of preferences for managing style conflicts. A conflict can occur, for example, when a user's browser preferences indicate text to be displayed in one font, while an incoming document style sheet calls for a different font. The cascade preferences will ensure the conflict is resolved and pages can be displayed. Cascading Style Sheets give designers additional control over typographic features such as line spacing, margin indents, and font selection. You can specify the position of elements using CSS rather than the more memory-intensive transparent GIFs. This allows your files to be smaller and to be opened more quickly by browsers. When appropriate, define styles globally
Your system of Cascading Style Sheets will work best when you assign styles at the highest appropriate level. If you apply a style sheet globally, you need to apply it only once. If you apply a style locally when it should be applied globally, you will need to place the code in more than one file. Also, if you apply styles globally, you can more easily make revisions to the layout of your entire site. Whenever possible, use style sheets to position elements Using style sheets to define the placement of elements is more efficient and manageable than using absolute positioning. Using style sheets to position elements gives you more control and consistency. Absolute positioning gives you control on a specific page but is less efficient and harder to maintain. Use inheritance to propagate styles in CSS Cascading Style Sheets employ a system of inheritance, in which the lower-level or child styles inherit properties from higher-level or parent styles. To produce an efficient style sheet system on a project, you should analyze your layout plan to see what features certain styles share with other features, and then decide where in the inheritance scheme every text formatting specification should take place Use absolute and relative style specifications To avoid manual and tedious adjustments to styles, take advantage of absolute and relative style specifications. For example, assume you use an absolute setting for the body text, such as "BODY {font-size: 10pt}" and a relative style for a level two heading, such as "H2 {font size: 80%}". If you later change the size of "BODY" to 12 pt., the H2 style will automatically make itself larger, preserving the 80% size relationship. When specifying fonts, provide the desired font, an alternate font, and a default font The cascading system works by making choices and compromises among groups of options. For the system to work properly, alternate font specifications should be provided within the style sheets. For example, you could have a style sheet which states "BODY {font-family: Officina, Arial, sans-serif}." This will cause users to see Officina if they have it, Arial if they don't have Officina, and whatever sans-serif font is alphabetically at the top of their own font list if they have neither Officina or Arial. (The last font specification is a default one, which is not a specific font but rather a class of fonts). Use rule exceptions with caution Since the keyword !important will override a users' settings, use it with extreme caution. In general, you want your users to have control over their settings. For instance, people with impaired vision might not be able to read any of your text if you use !important to require them to read ten point font. Define a clear policy for the entire team to follow
|
|
|
|