css属性
来源:互联网 发布:php开源商城源码下载 编辑:程序博客网 时间:2024/06/09 17:08
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
兼容
- CSS 属性
- css属性
- CSS属性
- css属性
- CSS 属性
- css属性
- css属性
- CSS属性
- css属性
- CSS属性
- CSS属性
- css 属性
- CSS属性
- css属性
- CSS属性
- CSS 属性
- CSS属性
- css属性
- 数据结构之栈的顺序存储6-(入栈,出栈等)
- TextView 走马灯效果
- Git之多人协作
- 北风吹,秋风凉 谁家娇妻守空房 你有困难我帮忙 我住隔壁我姓王
- Android 后台发送邮件 (收集应用异常信息+Demo代码)
- css属性
- Android lunch分析以及产品分支构建
- 遗传算法中的CROSSOVER和MUTATION
- 微信公众平台JSSDK开发实战——公众号与HTML5混合模式揭秘——互动出版网
- 台阶问题
- SSL ENGINE机制 二
- shell脚本实现对网卡流量监控
- AM-资产冻结与停用
- 包装类与数据类型之间的转换