Getting Started with CSS

After understanding the XHTML code specification, we need to do CSS layout. First, introduce some of the basics of CSS. If you are already familiar with it, you can skip this section and go straight to the next section.

CSS is the abbreviation for cascading style Sheets (cascading style sheets). is a simple mechanism for adding styles to Web documents, belonging to the layout language of the presentation layer.

1. Basic Grammatical specifications

Parse a typical CSS statement:

P {COLOR: #FF0000; BACKGROUND: #FFFFFF}

Where "P" we call "selector" (selectors), indicates that we want to define a style for "P";

The style declaration is written in a pair of curly braces "{}";

Color and background are called "Properties", with semicolons ";" between different attributes. Separated

"#FF0000" and "#FFFFFF" are the values (value) of the property.
2. Color value

Color values can be written in RGB values, such as: Color:rgb (255,0,0), or in hexadecimal, as in the example color: #FF0000. If the hexadecimal value is a pair of duplicates, the effect will be the same. For example: #FF0000可以写成 #f00. However, if you do not repeat, you can not abbreviate, for example, #fc1a1b must be written full six digits.

3. Define Fonts

Web standards recommend the following font definition methods:

Body {font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, XXFarEastFont-Franklin, Sans-serif;

Fonts are selected in the order listed. If the user's computer contains Lucida Grande fonts, the document is specified as Lucida Grande. If not, it is specified as a Verdana font, and if there is no Verdana, specify the Lucida font, and so on;

Lucida Grande fonts for Mac OS X;

Verdana fonts are suitable for all Windows systems;

Lucida for UNIX users

"Song body" suitable for Chinese simplified users;

If none of the listed fonts are available, the default Sans-serif font is guaranteed to be invoked;

4. Group Selector

When several element style attributes are the same, a declaration can be invoked together, separated by commas between the elements: P, TD, Li {font-size:12px;}