最近在学习前端知识，学习之余回顾了一些css的基础知识，有简要的解释，本来源码里面有一些附带有链接，不过因版权问题没有附带上，要完整的源码可以发短消息给我。
/*派生选择器-example*/
li strong{
font-style: italic;
font-weight: normal;
}/*只对li标签中的strong标签有效，不在li标签中的strong均没有这种样式*/
/*id选择器-example*/
#red {
color:red;
font-family: Times;
}/*id选择器以#开头，只能在每个html文档中使用一次*/
/*id派生选择器*/
#sidebar p {
font-style: italic;
text-align: center;
}
/*class（类）选择器*/
.center {
text-align: center;
}/*类名的第一个字符不能使用数字！firefox中无法起作用*/
/*属性选择器*/
[title~=hello] {
color: red;
}/*属性选择器title=hello，在应用时有title=hello world同样起作用*/
[lang|=en] {
color: red;
}/* <p lang="en-us"></p>可以应用样式*/
/* selector */
exp:
p {} /*元素选择器*/
#id {} /*id选择器*/
.class {} /*类选择器*/
p a{} /*后代选择器*/
p > a {} /*子代选择器，区别后代，指p后面的第一个子a标签，其余不受影响，eg,<p><em><a></a></em></p>*/
p + a {} /*相邻兄弟选择器，一个结合符只能选择两个相邻兄弟中的第二个元素*/
/*内联样式、内部样式表、外联样式表 导入样式表*/
/*优先使用顺序：就近原则,即内联样式、内部样式表、外联样式表 导入样式表*/
<p style="color: red; margin-left: 20px"></p>
<style type="text/css">
p {
color: red;
font-family: Arial;
}
</style>
<link rel="stylesheet" type="text/css" href="../../">
<style type="text/css">
@import "test.css";
</style>
/*权值计算详解：
内联样式：权值为1000
ID选择器：权值为100
类选择器: 权值为10
元素选择器: 权值为1*/
/* 特殊情况: 当样式后带有!important，则优先级最高*/
/* BOX-model */
盒子模型: margin; border; padding; content;
/* 超链接的四种状态 */
a:link {color:#FF0000;} /* 未被访问的链接 */
a:visited {color:#00FF00;} /* 已被访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标指针移动到链接上 */
a:active {color:#0000FF;} /* 正在被点击的链接 */
/* a:hover 必须位于 a:link 和 a:visited 之后
a:active 必须位于 a:hover 之后*/
/* border-style */
a:link {border-style: outset;}
/* border-width */
It must need border-style first!
exp:
p {
border-style: solid;
border- 20px 15px;
}
/* 改变鼠标指针样式 */
ref:http://www.w3school.com.cn/css/css_classification.asp;
/*伪类*/ /*伪元素*/
psevdo-classes psevdo-elements
:link :first-letter
:visited :first-line
:hover :before
:active :after
:focus :selection
:first-child