css basics

1.Basic grammar specifications

Analyze a typical css statement:
p {color:#ff0000;background:#ffffff}
· Among them "p"we call it "selector"(selectors ), indicating that we want to define the style for "p";
·The style declaration is written in a pair of curly brackets "{}";
·color and background is called "property"(property), and different properties are separated by semicolons ";";
·"#ff0000" and "#ffffff " is the value of the attribute (value).

2.Color value
The color value can be written in RGBvalue, for example: color : rgb(255,0,0), or it can be written in hexadecimal, just Like the example above color: #FF0000. If the hexadecimal values ​​are repeated in pairs they can be abbreviated with the same effect. For example : #FF0000 can be written as #F00. However, it cannot be abbreviated if it does not repeat. For example, #FC1A1B must be filled with six digits.

3.定义字体
web标准推荐如下字体定义方法：
body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif; } 
字体按照所列出的顺序选用。如果用户的计算机含有Lucida Grande字体，文档将被指定为Lucida Grande。没有的话，就被指定为Verdana字体，如果也没有Verdana，就指定为Lucida字体，依此类推，； 
·Lucida Grande字体适合Mac OS X； 
·Verdana字体适合所有的Windows系统； 
·Lucida适合UNIX用户 
·"宋体"适合中文简体用户; 
如果所列出的字体都不能用，则默认的sans-serif字体能保证调用; 

4.群选择器
当几个元素样式属性一样时，可以共同调用一个声明，元素之间用逗号分隔，：
 p, td, li { font-size : 12px ; } 

5.派生选择器
可以使用派生选择器给一个元素里的子元素定义样式，例如这样：
li strong { font-style : italic; font-weight : normal；} 
就是给li下面的子元素strong定义一个斜体不加粗的样式。

6.id选择器
用CSS布局主要用层“div”来实现，而div的样式通过“id选择器”来定义。例如我们首先定义一个层

“menubar”>

Then define it like this in the style sheet:
#menubar {MARGIN: 0px;BACKGROUND: #FEFEFE;COLOR: #666;}
where"menubar" is your own definitionid name. Please add "#" in front.
idThe selector also supports derivation, for example:
#menubar p { text-align : right; margin-top : 10px; }
This method is mainly used to define layers and those that are more complex and have multiple derivation element.

7.Category selector
Use a dot at the beginning of CSS to indicate the category selector definition, for example:
.14px {color : #f60 ;font-size:14px ;}
In the page, use the class="category name" method call:
14px size font
This method compares Simple and flexible, you can create and delete pages as needed at any time.

7.Define the link style
CSS uses four pseudo-classes to define the link style, namely: 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 respectively define the styles of " links, visited links, when the mouse is parked above, and when the mouse is clicked ".

Note:

Must be written in the above order, otherwise the display may be different from what you expected. Remember that their order is "LVHA".