css属性

1、  布局

属性	语法	css	兼容
display	none|block|inline	1
	block-inline|list-item|table|table-cell	2	Ie6-7
float	none|left|right(display:block;)	1
clear	none|left|right|both	1
visibility	visible|hidden|collapse(主要用来隐藏表格的行或列，IE6不支持)	1
clip	auto|rect(<number>|auto <number>|auto <number>|auto <number>|auto)	2
overflow	<overflow-style>{1,2} <overflow-style>=visible|hidden|scroll|auto	2

 

2、  定位

属性	语法	css	兼容
position	static|relative|absolute|fixed(默认宽度为内容宽度、脱离文档流、参考物是视窗)	2	IE6不支持position属性的fixed参数值
z-index	Auto|<integer> position属性值为absolute、relative或fixed，此取值方可生效。	2
top	<length>|<percentage>|auto	2
right	<length>|<percentage>|auto	2
bottom	<length>|<percentage>|auto	2
left	<length>|<percentage>|auto	2

 

3、盒模型

属性	语法	css	兼容
width	<length>|<percentage>|auto	1
min-width	<length>|<percentage>	2	Ie6
max-width	<length>|<percentage>	2	Ie6
height	<length>|<percentage>|auto	1
min-height	<length>|<percentage>	2	Ie6
max-height	<length>|<percentage>	2	Ie6
margin	[<length>|<percentage>]{1,4}|inherit	1
padding	[<length>|<percentage>]{1,4}|inherit	1
border	[<border-width>||<border-style>||<border-color>] Eg:border:1px solid #333;	1
border-radius	[<length>|<percentage>]{1,4}[/[<length>|<percentage>]{1,4}]? Eg:border-radius:2em 1em 4em/0.5em 3em;	3	Ie6-8
box-shadow	None|<shadow>[,<shadow>]* <shadow> =inset?&&<length>{2,4}&&<color>? Eg: box-shadow:insert 4px 0px 0px red;	3	Ie6-8
outline	[outline-width]||[outline-style]||[outline-color]	2	Ie6-7
box-sizing	Content-box|border-box	3	Ie6-7

 

4、背景

属性	语法	css	兼容
background	[background-color]||[background-image]||[background-repeat]|| [background-attachment]||[background-position]	1
background-origin	<box>[,<box>]* <box>=borer-box|padding-box|content-box	3	Ie6-8
background-size	<bg-size>[,<bg-size>]* <bg-size>=[<length>|<percentage>|auto]{1,2}|cover|contain	3	Ie6-8

 

5、颜色

属性	语法	css	兼容
color	<color>	1
opacity	<number> Eg:opacity:0.5; 兼容解决：filier:alpha(opacity=50);	3	Ie6-8

 

6、字体

属性	语法	css	兼容
font	[[<font-style>||<font-weight>]?<font-size>[/<line-height>]?<font-family>] Eg:font:12px/1.5 "Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB",\5FAE\8F6F\96C5\9ED1,tahoma,simsun,\5b8b\4f53;	1
font-style	normal|italic(字体本身自带斜体)|oblique(强制斜体)	1
font-weight	normal(400)|bold(700)|bolder|lighter	1
font-size	<length>|<percentage>|<absolute-size>|<relative-size>	1
line-height	normal(由浏览器决定，一般在1.1~1.2之间，通常在1.14左右)|<number>|<length>(em,px)|<percentage>	1
font-family	[<family-name>|<generic-family>]* Eg:font-family:"Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB", \5FAE\8F6F\96C5\9ED1,tahoma,simsun,\5b8b\4f53;	1

 

7、文本

属性	语法	css	兼容
direction	ltr|rtl	2
letter-spacing	normal|<length>	1
word-spacing	normal|<length>	1
text-align	left| center| right| justify| start| end	1	灰色差
text-decoration	none|[underline(下划线)||overline(上划线)||line-through(文字中间)]	1
text-overflow	clip|ellipsis	3	ff4-6
text-indent	<length>|<percentage>(首行缩进)	1
text-shadow	none|<shadow>[,<shadow>]* <shadow>=<length>{2,3}&&<color>?	2	IE6-9
text-transform	none|[[capitalize|uppercase|lowercase ] || full-width || full-size-kana ]	1
vertical-align	baseline|sub|super|top|text-top|middle|bottom|text-bottom|<percentage>	1
	<length>	2
white-space	Normal(被合并成一个空格,可以自动换行)| pre(空白会被浏览器保留)| nowrap(文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止)| pre-wrap(保留空白符序列，但是正常地进行换行)| pre-line(合并空白符序列，但是保留换行符)	1
word-break	normal|break-all|keep-all	3
word-wrap	normal|break-word(让长单词自动换行)	3

 

8、列表

属性	语法	css	兼容
list-style	[ list-style-image ] || [ list-style-position ] || [ list-style-type ]	1
list-style-image	none|<url>	1
list-style-position	outside|inside	1
list-style-type	disc |circle |square |decimal |lower-roman | upper-roman | lower-alpha | upper-alpha| none	1
	…| lower-latin | upper-latin	2

 

9、表格

属性	语法	css	兼容
table-layout	auto(基于内容，慢)|fixed(基于布局，速度快，内容可能会被剪裁)	2
border-collapse	separate|collapse	2
border-spacing	<length>{1,2}(只有当border-collapse的属性为separate时属性才起作用)	2	IE6-7
caption-side	top|right|bottom|left	2	IE6-7
empty-cells	hide|show	2	IE6-7

 

10、2D/3D转换

属性	语法	css	兼容

 

11、过渡

属性	语法	css	兼容

 

12、动画

属性	语法	css	兼容