CSS内容简单归纳

具体内容请查阅《CSS参考手册》

一、CSS模块介绍

1.1 CSS1中定义了网页基本属性

字体、颜色、补白、基本选择器等

1.2 CSS2中在CSS1的基础上添加了高级功能

浮动和定位、高级选择器（子选择器、通用选择器）

1.3 CSS3遵循的是模块化开发。发布时间并不是一个时间点，而是一个时间段

二、CSS3新特性

1) 强大的css选择器
2) 新的颜色制式
3) 多栏布局的实现
4) 多背景图效果
5) 文字阴影效果
6) 开放的网络字体类型
7) 圆角
8) 边框背景图片
9) 盒子阴影
10) 媒体查询

三、选择器

3.1 元素选择器

选择符	类型	介绍	版本
E	类型选择符	以文档语言对象类型作为选择符	CSS1
#myid	id选择符	以唯一标识符id属性等于myid的E对象作为选择符	CSS1
.myclass	class选择符	以class属性包含myclass的E对象作为选择符	CSS1
*	通配选择符	所有元素对象	CSS2

3.2 关系选择器

选择符	类型	介绍	版本
E F	包含选择器	选择所有被E包含的F元素	CSS1
E>F	子选择器	选择所有作为E元素的子元素F	CSS2
E+F	相邻选择器	选择紧贴在E元素之后的F元素	CSS2
E~F	兄弟选择符	选择E元素所有兄弟元素F	CSS3

3.3 伪类选择器

选择符	类型	介绍	版本
E:link	链接伪类选择器	设置超链接a在未被访问前的样式	CSS1
E:visited	链接伪选择器	设置超链接a被访问后的样式	CSS1
E:hover	用户操作伪类选择器	设置鼠标悬停在元素E时的样式	CSS1/CSS2
E:active	用户操作伪类选择器	设置元素被用户激活时（鼠标点击与释放之间发生的事件）的样式	CSS1/CSS2
E:focus	用户操作伪类选择器	设置元素成为输入焦点时的样式	CSS1/CSS2
E:lang()	:lang()作伪类选择器	匹配使用特殊语言的E元素	CSS2

3.4 属性选择器

选择符	介绍	版本
E[attr]	选择包含attr属性的E元素	CSS2
E[attr="val"]	选择具有att属性且属性值等于val的E元素	CSS2
E[attr~="val"]	选择具有att属性且属性值为一用空格分隔的字词列表，其中一个等于val的E元素	CSS2
E[attr|="val"]	选择具有att属性且属性值为以val开头并用连接符"-"分隔的字符串的E元素，如果属性值仅为val，也将被选择	CSS2
E[attr^="val"]	选择具有att属性且属性值为以val开头的字符串的E元素	CSS3
E[attr$="val"]	选择具有att属性且属性值为以val结尾的字符串的E元素	CSS3
E[att*="val"]	选择具有att属性且属性值为包含val的字符串的E元素	CSS3

3.5 伪对象选择器

选择符	介绍	版本
E::first-leter	设置对象内的第一个字符的样式	CSS3
E::first-line	设置对象内的第一行的样式	CSS3
E::before	设置在对象前（依据对象树的逻辑结构）发生的内容。用来和content属性一起使用，并且必须定义content属性	CSS3
E::after	设置在对象后（依据对象树的逻辑结构）发生的内容。用来和content属性一起使用，并且必须定义content属性	CSS3

四、颜色

属性	介绍	版本
color	指定颜色。请参阅颜色值	CSS1
opacity	检索或设置对象的不透明度	CSS3

五、布局

属性	介绍	版本
display	设置或检索对象是否及如何显示	CSS2/CSS3
float	该属性的值指出了对象是否及如何浮动	CSS1
clear	该属性的值指出了不允许有浮动对象的边	CSS1
visibility	设置或检索是否显示对象。与display属性不同，此属性为隐藏的对象保留其占据的物理空间	CSS2
overflow	复合属性。检索或设置对象处理溢出内容的方式	CSS2/CSS3
overflow-x	检索或设置对象处理横向溢出内容的方式	CSS2/CSS3
overflow-y	检索或设置对象处理纵向溢出内容的方式	CSS2/CSS3

六、多列

属性	介绍	版本
columns	设置或检索对象的列数和每列的宽度。复合属性	CSS3
column-width	设置或检索对象每列的宽度	CSS3
column-count	设置或检索对象的列数	CSS3
column-gap	设置或检索对象的列与列之间的间隙	CSS3
column-rule	设置或检索对象的列与列之间的边框。复合属性	CSS3
column-rule-width	设置或检索对象的列与列之间的边框厚度	CSS3
column-rule-style	设置或检索对象的列与列之间的边框样式	CSS3
column-rule-color	设置或检索对象的列与列之间的边框颜色	CSS3
column-span	设置或检索对象元素是否横跨所有列	CSS3
column-fill	设置或检索对象所有列的高度是否统一	CSS3
column-break-before	设置或检索对象之前是否断行	CSS3
column-break-after	设置或检索对象之前是否断行	CSS3
column-break-inside	设置或检索对象内部是否断行	CSS3

七、背景

属性	介绍	版本
background	复合属性。设置或检索对象的背景特性	CSS1/CSS3
background-origin	设置或检索对象的背景图像显示的原点	CSS3
background-clip	检索或设置对象的背景向外裁剪的区域	CSS3
background-size	检索或设置对象的背景图像的尺寸大小	CSS3

八、文本

属性	介绍	版本
text-indent	检索或设置对象中的文本的缩进	CSS1/CSS3
letter-spacing	检索或设置对象中的字符之间的最小，最大和最佳间隙	CSS1/CSS3
word-spacing	检索或设置对象中的单词之间的最小，最大和最佳间隙	CSS1/CSS3
text-align	设置或检索对象中内容的水平对齐方式	CSS1/CSS3
vertical-align	设置或检索对象内容的垂直对其方式	CSS1/CSS2
white-space	设置或检索对象内空格的处理方式	CSS1
line-height	检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离	CSS1
tab-size	检索或设置对象中的制表符的长度	CSS3
word-wrap	设置或检索当内容超过指定容器的边界时是否断行	CSS3
word-break	设置或检索对象内文本的字内换行行为	CSS3
overflow-wrap	设置或检索当内容超过指定容器的边界时是否断行	CSS3
text-justify	设置或检索对象内调整文本使用的对齐方式	CSS3
text-decoration	复合属性。检索或设置对象中的文本的装饰	CSS1/CSS3
text-decoration-line	检索或设置对象中的文本装饰线条的位置	CSS3
text-decoration-color	检索或设置对象中的文本装饰线条的颜色	CSS3
text-decoration-style	检索或设置对象中的文本装饰线条的形状	CSS3
text-decoration-skip	检索或设置对象中的文本装饰线条必须略过内容中的哪些部分	CSS3
text-underline-position	检索或设置对象中的下划线的位置	CSS3
text-shadow	设置或检索对象中文本的文字是否有阴影及模糊效果	CSS3

九、边框

属性	介绍	版本
border	复合属性。设置对象边框的特性	CSS1
border-radius	设置或检索对象使用圆角边框	CSS3
box-shadow	设置或检索对象阴影	CSS3
border-image	设置或检索对象的边框样式使用图像来填充	CSS3