Basic tutorials for getting started with CSS tutorial

CSS is an abbreviation for cascading style Sheets (cascading style sheets). is a simple mechanism for adding styles to a Web document, which belongs to the presentation layer's layout language.
1. Basic Grammar Specification
To parse a typical CSS statement:
P {COLOR: #FF0000; BACKGROUND: #FFFFFF}
Where "P" we call the "selector" (selectors), indicating that we want to define the "P" style;
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 values
The color values can be written in RGB values, for example: Color:rgb (255,0,0), or in hexadecimal, as in the example color above: #FF0000. If the hexadecimal value is a pair of duplicates can be abbreviated, the same effect. For example: #FF0000可以写成 #f00. However, if you do not repeat it, for example, #fc1a1b must be written six bits.
3. Defining fonts
The Web Standard recommends the following font definition methods:
Body {font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, song Body, Sans-serif;}
Fonts are selected in the order listed. If the user's computer contains Lucida Grande fonts, the document will be designated as Lucida Grande. If not, it is designated as a Verdana font, and if there is no Verdana, it is specified as Lucida font, and so on;
Lucida Grande fonts are suitable for Mac OS X;
Verdana fonts are suitable for all Windows systems;
Lucida for UNIX users
"Song body" suitable for Chinese simplified users;
If the fonts listed are not available, the default Sans-serif font is guaranteed to be called;
4. Group Selector
When several element style attributes are the same, a declaration can be called together, separated by commas: p, TD, Li {font-size:12px;}
5. Deriving selectors
You can use a derived selector to define a style for child elements in an element, such as this:
Li Strong {font-style:italic; font-weight:normal;}
is to give Li the following child element strong define a style that is not bold in italics.
6.id Selector
The CSS layout is mainly implemented with the layer "div", and the style of the div is defined by the "ID selector". For example, we first define a layer

This is then defined in the style table:
#menubar {margin:0px; BACKGROUND: #FEFEFE; COLOR: #666;}
where "menubar" is your own definition of the ID name. Note the "#" number in front.
The ID selector also supports derivation, for example:
#menubar p {text-align:right; margin-top:10px;}
This method is primarily used to define layers and those that are more complex and have multiple derived elements.
6. Category Selector
The class selector definition is represented in CSS using a dot, for example:
.14px {color: #f60; font-size:14px;}
In the page, use the class= "category name" method call:
14px-size fonts
This method is relatively simple and flexible, can be created and deleted according to the needs of the page at any time.
7. Define the style of the link
CSS uses four pseudo-classes to define the style of the link: a:link, a:visited, A:hover, and a:active, for example:
a:link{font-weight:bold; text-decoration:none; color: #c00;}
a:visited {font-weight:bold; text-decoration:none; color: #c30;}
a:hover {font-weight:bold; text-decoration:underline; color: #f60;}
a:active {font-weight:bold; text-decoration:none; color: #F90;}
The above statements define the styles of links, visited links, mouse over, mouse down, respectively. Note that you must write in the order above, otherwise the display may not be the same as you expected. Remember that their order is "LVHA".

