属性 | 意义 | 示例 |
---|---|---|
font / font | 复合设置 | font-style font-variant font-weight font-size line-height font-family |
color / color | 文字颜色 | black |
font-family /fontFamily | 字体 | 宋体 |
font-size / fontSize | 字号 | 10px |
font-size-adjust / fontSizeAdjust | 各字体使用原尺寸 | none 使用原尺寸 大小 |
font-style / fontStyle | 斜体 | normal 正常、italic 斜体、oblique 倾斜 |
font-weight / fontWeight | 加粗 | lighter, normal, bold, bolder 100/200/.../900 |
text-decoration / textDecoration | none 普通 blink 闪烁 underline 下划线 line-througn 贯穿线 overline 上划线 |
|
font-underline-position / textUnderlinePosition | 下划线/上划线 | below 文本下面,above 文本上面 |
text-shadow / textShadow | 字体阴影,(CSS2) | color length length opacity 颜色 水平延伸 垂直延伸 模糊距离 |
font-variant / fontVariant | 小型大写字母 | normal 普通,small-caps 小型大写字母 |
text-transform / textTransform | 大小写设置 | none 普通 capitalize 首字母大写 uppercase 全大写 lowercase 全小写 |
line-height / lineHeight | 行高 | 1, 2 |
letter-spacing / letterSpacing | 字间距 | normal 普通 尺寸 |
word-spacing / wordSpacing | 单词间距 | normal 普通 尺寸 |
属性 | 意义 | 示例 |
---|---|---|
text-indent | 首行缩进 | 2em(缩进两字符) |
text-overflow | 超宽省略号 | clip 直接裁剪 ellipsis 省略号 |
vertical-align / verticalAlign | 垂直对齐方式 | auto | baseline | sub | super | top | text-top | middle | bottom | text-bottom | length |
text-align / textAlign | 水平对齐 | left, right, center, justify 两端对齐 |
layout-flow / layoutFlow | 行文方向 | horizontal 自左向右, vertical-ideographic 自上而下 |
writing-mode / writingMode | 书写方向 | lr-tb 水平方向自左向右,自上而下 tb-rl 垂直方向自上向下,自右向左 |
direction | 文本方向 | ltr 左 -> 右 rtl 左 <- 右 inherit 继承 |
unicode-bidi | ||
word-break / wordBreak | 断行设置 | normal 在单词之间断行 break-all 任意位置断行(中文) keep-all 不换行(文字可能被裁剪) |
line-break | 日文换行规则 | |
white-space | 空格处理方式 | normal 忽略 pre 原样 nowrap 不自动换行 |
word-wrap | 容器边界转行 | normal 顶开容器边界 break-word 边界内换行 |
layout-grid | 复合属性 | layout-grid-mode layout-grid-type layout-grid-line layout-grid-char |
layout-grid-char | 字符网格尺寸 | none auto 长度 |
layout-grid-line | 行网格尺寸 | none auto 长度 |
layout-grid-mode | 网格选择 | both 都启用 line 只启用行网格 char 只启用字符网格 none 不使用网格 |
layout-grid-type | 网格类型 | loose 只指定中文对齐网络 strict 日文 fixed 全部对齐网格 |
属性 | 意义 | 示例 |
---|---|---|
background-attachment / backgroundAttachment | 背景图象是否固定 | scroll 随文字 fixed 在屏幕固定位置 |
background-color / backgroundColor | 背景色 | #RRGGBB, red |
background-image / backgroundImage | 背景图 | url("sky.jpg") |
background-position / backgroundPosition | 背景图位置,双参数 | %0 %0 左上角 水平位置 垂直位置 |
background-positionX / backgroundPositionX | 背景图水平位置 | left center right |
background-positionY / backgroundPositionY | 背景图垂直位置 | top center buttom |
background-repeat / backgroundRepeat | 背景图是否重复显示 | no-repeat 仅显示一次 repeat 铺满 repeat-x 水平铺满 repeat-y 垂直铺满 |
layer-background-color | 背景颜色 | transparent 透明 颜色 |
layer-background-image | 背景图象 | none 无背景图 url(url) 背景图象 |
属性 | 意义 | 示例 |
---|---|---|
position | 定位方式 | static 无特殊定位 absolute 设置绝对位置,拖出文档流 fixed 未支持 relative 对象不可层叠,偏移文档流 |
z-index | 层叠顺序 | auto 数值,数大者居上 |
top right bottom left |
auto 无特殊定位 尺寸 |
属性 | 意义 | 示例 |
---|---|---|
height | 高度 | auto 默认值 尺寸 |
max-height | 最大高度 | |
min-height | 最小高度 | |
width | 宽度 | |
max-width | 最大宽度 | |
min-width | 最小宽度 |
属性 | 意义 | 示例 |
---|---|---|
clear | 浮动对象设置 | none 左右都可以有 left 左边不允许 right 右边不允许 both 左右都不允许 |
float | 对象飘浮设置 | none 默认值。对象不飘浮 left 文本流向对象的右边 right 文本流向对象的左边 |
clip | 对象可视区域/裁剪 | auto 无裁剪 rect(上 右 下 左) 指定裁剪坐标值,用 auto 即不裁剪, 注:必需 position:absolute |
overflow | 对象超限设置 | visible 不裁剪,不添加滚动条 auto 裁剪或添加滚动条 hidden 不显示超出部分 scroll 总是显示滚动条 |
overflow-x | 对象水平超限 | 同上 |
overflow-y | 对象垂直超限 | 同上 |
display | 显示设置 | block 作为块对象,对象后添加新行 none 不显示对象 inline 内联对象,从对象是删除行 inline-block 内联对象,块对象呈现 |
visibility | 显示设置 | inherit 继承设置 visible 对象可视 hidden 对象隐藏 |
属性 | 意义 | 示例 |
---|---|---|
margin margin-left |
外补丁 | auto 自动 尺寸 |
padding | 内补丁 | |
padding-top / paddingTop padding-right / paddingRight padding-bottom / paddingBottom padding-left / paddingLeft |
各方向内补丁 | |
outline-color | 轮廓颜色 | 颜色 invert 背景色的反色 |
outline-style | 轮廓类型 | none
dotted 点线 |
outline-width | 轮廓宽度 | medium 默认宽度 thin 小一些 thick 大一些 尺寸 |
属性 | 意义 | 示例 |
---|---|---|
include-source | 插入文档替代对象内容 | url(url) |
quotes | 设定嵌套标记,单双引号 | none quotes:"<" ">" "'" "'" |
content | ||
counter-increment | ||
counter-reset |
IE5.5 及以上专有。
属性 | 意义 | 示例 |
---|---|---|
overflow | 滚动条 | visible 显示 auto 自动 scroll 总是显示 hidden 不显示 |
scrollbar-3dlight-color / scrollbar3dLightColor | 亮边框色 | |
scrollbar-highlight-color / scrollbarHighlightColor | 3D界面亮边色 | |
scrollbar-darkshadow-color / scrollbarDarkShadowColor | 暗边框色 | |
scrollbar-shadow-color / scrollbarShadowColor | 3D界面暗边色 | |
scrollbar-arrow-color / scrollbarArrowColor | 方向箭头色 | |
scrollbar-face-color / scrollbarFaceColor | 3D表面色 | |
scrollbar-base-color / scrollbarBaseColor | 基准色,其他颜色默认为自动 | |
scrollbar-track-color / scrollbarTrackColor | 拖动区域色 |
属性 | 意义 | 示例 |
---|---|---|
border-collapse / borderCollapse | 单元格边框独立 | separate 独立 collapse 合并 |
border-spacing / borderCollapse | 单元格间距 | |
caption-side / borderCollapse | 表格 caption 方向 | top right bottom left |
empty-cells / emptyCells | 空格边框 | show 显示 hide 隐藏 |
table-layout / | 表格自动算法 | auto 自动宽度 fixed 固定宽度 |
speak-header / speakHeader | 发声设置 | once always |
属性 | 意义 | 示例 |
---|---|---|
border / border | 宽度、样式、颜色合一 | 1px solid red |
border-width / borderWidth | 宽度 | 1px |
border-style / borderStyle | 样式 | none 无边框
hidden 隐藏边框 dotted 点线 dashed 虚线 solid 实线 double 双线 groove 凹槽 ridge 凸槽 inset 凹边 outset 凸边 |
border-color / borderColor | 颜色 | #RRGGBB, red |
border-方向 / borderTop
border-方向-width / borderTopWidth border-方向-style / borderTopStyle border-方向-color / borderTopColor |
left
right top bottom |
值 | 意义 | 示例/备注 |
---|---|---|
auto | 自动 | |
all-scroll | 四箭头,中圆点 | IE6 |
col-resize | 左右箭头 | IE6 |
crosshair | 十字 | |
default | 普通箭头 | |
hand | 手形 | |
move | 四箭头十字 | |
help | 箭头带问号 | |
no-drop | 手形加禁止 | IE6 |
not-allowed | 禁止 | IE6 |
pointer | 同 hand | IE6 |
progress | 沙漏箭头 | IE6 |
row-resize | 上下箭头 | IE6 |
text | 文本光标 I | |
vertical-text | 垂直文本 | IE6 |
wait | 沙漏 | |
*-resize | * = w, s, n, e, ne, sw, se, nw | w-resize |
url(url) | 自定义光标,后缀 .cur / .ani | IE6 |
属性 | 意义 | 值 |
---|---|---|
zoom | 显示比例 | normal, 1.0, 100% |
className | 类名 | |
ime-mode | 输入法 | auto 无影响 active 本地语言输入法 inactive 非本地语言输入法 disabled 禁用输入法 |