CSS属性大全
- 格式:doc
- 大小:52.50 KB
- 文档页数:8
css属性分类介绍css属性分类介绍CSS分类⽬录1. ⽂本/字体/颜⾊1. ⽂本相关2. 字体相关3. 颜⾊相关4. 背景相关2. ⼤⼩/布局1. ⼤⼩属性2. margin 外边距3. padding 内边距4. border 边框5. position 定位3. 列表/表格1. 多列属性2. 可伸缩框属性3. 列表属性4. Grid属性5. Table属性4. 动画属性1. Animation 动画属性2. Transition 过渡属性CSS属性分类⽂本/字体/颜⾊/背景字体类1. font-family:指定字体1. 需要考虑客户端机器上是否装有字体2. 可以排列多个字体,⽤逗号分隔,如果有空格⽤引号分隔3. 最后⼀个建议放通⽤字体名,这个属性只有⼏个选项:serif | sans-serif | cursive | fantasy | monospace2. font-size:字体⼤⼩,要注意有绝对⼤⼩,相对⼤⼩,长度,百分⽐1. ⼀般建议采⽤相对⼤⼩,即em或者rem2. 典型的长度单位,详细信息请参考3. font-style:正常体、斜体、倾斜体4. font-weight:设置粗体5. font-variant:⽤来将所有字体都变成⼤写,但是原来是⼤写的字体呢⼜要⽐默认的要⼤⼀些6. font:1. 简写形式,如上所有跟字体相关的字体混合在⼀起2. font-family是必选的,⽽且⼀定要在最后;font-size如果有,必须出现在倒数第⼆个, 后⾯可以⽤/跟⼀个line-height的设置3. 剩下的font-style, font-weight, font-variant就⽆所谓了,前⾯任意排列4. font还⽀持⼀些类似caption, icon等快捷描述5. 详细请参考7. line-height:⼀个数字,默认差不多为1.2,有normal/数字/长度/百分⽐1. ⼀般建议使⽤纯数字, ⽤长度和百分⽐都在某些特殊情况下超出预期,即⼦元素的⾏⾼被⽗亲元素设置了,同时⼦元素还有默认的浏览器字体设置的场景。
CSS——⼋⼤属性⼀、颜⾊有三种表⽰颜⾊的⽅法:英⽂单词、⼆进制颜⾊代表码、rgb,⼆、字体font-size:15px;设置字体⼤⼩,常⽤像素指定字体⼤⼩,指定长度的字号,不会随着浏览器的变化⽽变化font-family:宋体;设置字体类型font-weight:lighter、bold、bolder,设置字体粗细,常⽤的三种效果选择font-style:oblique;设置字体倾斜font-variant:small-caps;将⼩写字母转成⼤写字母;color:设置字体颜⾊<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>exercise4</title><style>#color_en{color:blue}#color_bin{color:#F0F;}#color_rgb{color:rgb(255,0,255)}#color_pellucidity{color:rgba(255,0,255,0.2)}#ablout_font{background-color:rgba(0,255,255,0.2);}#font_size{background-color:rgba(0,255,255,0.2);font-size:15px;}#font_family{background-color:rgba(0,255,255,0.2);font-family:YouYuan;}#font_lighter{background-color:rgba(0,255,255,0.2);font-weight:lighter;}#font_bold{background-color:rgba(0,255,255,0.2);font-weight:bold;}#font_bolder{background-color:rgba(0,255,255,0.2);font-weight:bolder;}#font_style{background-color:rgba(0,255,255,0.2);font-style:oblique;}</style></head><body><p>练习属性property</p><p id="ablout_font">⼆、关于字体</p><p id="font_size">font-size设置字体⼤⼩,如:15px</p><p id="font_family">font-family设置字体类型如:YouYuan</p><p id="font_weight"><a id="font_bolder">bolder</a></p><p id="font_style">font-style设置字体倾斜</p><p id="color_en">⼀、关于颜⾊</p><p id="color_bin">除了使⽤英⽂单词,还可以使⽤⼗六进制颜⾊对应表(如下图,#FFFF00表⽰黄⾊,还可简写成#FF0)<table border="0"><tbody><tr><td height="30" width="95" bgcolor="#ffffff">#FFFFFF</td><td height="30" width="95" bgcolor="#dddddd">#DDDDDD</td><td height="30" width="95" bgcolor="#aaaaaa">#AAAAAA</td><td height="30" width="95" bgcolor="#888888">#888888</td><td height="30" width="95" bgcolor="#666666">#666666</td><td height="30" width="95" bgcolor="#444444">#444444</td><td height="30" width="95" bgcolor="#000000">#000000</td></tr><tr><td height="30" width="95" bgcolor="#ffb7dd">#FFB7DD</td><td height="30" width="95" bgcolor="#ff88c2">#FF88C2</td><td height="30" width="95" bgcolor="#ff44aa">#FF44AA </td><td height="30" width="95" bgcolor="#ff0088">#FF0088 </td><td height="30" width="95" bgcolor="#c10066">#C10066 </td><td height="30" width="95" bgcolor="#a20055">#A20055 </td><td height="30" width="95" bgcolor="#8c0044">#8C0044 </td></tr><tr><td height="30" width="95" bgcolor="#ffcccc">#FFCCCC</td><td height="30" width="95" bgcolor="#ff8888">#FF8888</td><td height="30" width="95" bgcolor="#ff3333">#FF3333 </td><td height="30" width="95" bgcolor="#ff0000">#FF0000 </td><td height="30" width="95" bgcolor="#cc0000">#CC0000 </td><td height="30" width="95" bgcolor="#aa0000">#AA0000 </td><td height="30" width="95" bgcolor="#880000">#880000 </td></tr><tr><td height="30" width="95" bgcolor="#ffc8b4">#FFC8B4</td><td height="30" width="95" bgcolor="#ffa488">#FFA488</td><td height="30" width="95" bgcolor="#ff7744">#FF7744 </td><td height="30" width="95" bgcolor="#ff5511">#FF5511 </td><td height="30" width="95" bgcolor="#e63f00">#E63F00 </td><td height="30" width="95" bgcolor="#c63300">#C63300 </td><td height="30" width="95" bgcolor="#a42d00">#A42D00 </td></tr><tr><td height="30" width="95" bgcolor="#ffddaa">#FFDDAA</td><td height="30" width="95" bgcolor="#ffbb66">#FFBB66</td><td height="30" width="95" bgcolor="#ffaa33">#FFAA33</td><td height="30" width="95" bgcolor="#ff8800">#FF8800 </td><td height="30" width="95" bgcolor="#ee7700">#EE7700 </td><td height="30" width="95" bgcolor="#cc6600">#CC6600 </td><td height="30" width="95" bgcolor="#bb5500">#BB5500 </td></tr><tr><td height="30" width="95" bgcolor="#ffee99">#FFEE99</td><td height="30" width="95" bgcolor="#ffdd55">#FFDD55</td><td height="30" width="95" bgcolor="#ffcc22">#FFCC22</td><td height="30" width="95" bgcolor="#ffbb00">#FFBB00 </td><td height="30" width="95" bgcolor="#ddaa00">#DDAA00 </td><td height="30" width="95" bgcolor="#aa7700">#AA7700 </td><td height="30" width="95" bgcolor="#886600">#886600 </td></tr><tr><td height="30" width="95" bgcolor="#ffffbb">#FFFFBB</td><td height="30" width="95" bgcolor="#ffff77">#FFFF77</td><td height="30" width="95" bgcolor="#ffff33">#FFFF33</td><td height="30" width="95" bgcolor="#ffff00">#FFFF00</td><td height="30" width="95" bgcolor="#eeee00">#EEEE00</td><td height="30" width="95" bgcolor="#bbbb00">#BBBB00</td><td height="30" width="95" bgcolor="#888800">#888800</td></tr><tr><td height="30" width="95" bgcolor="#eeffbb">#EEFFBB</td><td height="30" width="95" bgcolor="#ddff77">#DDFF77</td><td height="30" width="95" bgcolor="#ccff33">#CCFF33</td><td height="30" width="95" bgcolor="#bbff00">#BBFF00</td><td height="30" width="95" bgcolor="#99dd00">#99DD00</td><td height="30" width="95" bgcolor="#88aa00">#88AA00</td><td height="30" width="95" bgcolor="#ccff99">#CCFF99</td><td height="30" width="95" bgcolor="#bbff66">#BBFF66</td><td height="30" width="95" bgcolor="#99ff33">#99FF33</td><td height="30" width="95" bgcolor="#77ff00">#77FF00</td><td height="30" width="95" bgcolor="#66dd00">#66DD00</td><td height="30" width="95" bgcolor="#55aa00">#55AA00</td><td height="30" width="95" bgcolor="#227700">#227700</td></tr><tr><td height="30" width="95" bgcolor="#99ff99">#99FF99</td><td height="30" width="95" bgcolor="#66ff66">#66FF66</td><td height="30" width="95" bgcolor="#33ff33">#33FF33</td><td height="30" width="95" bgcolor="#00ff00">#00FF00</td><td height="30" width="95" bgcolor="#00dd00">#00DD00</td><td height="30" width="95" bgcolor="#00aa00">#00AA00</td><td height="30" width="95" bgcolor="#008800">#008800</td></tr><tr><td height="30" width="95" bgcolor="#bbffee">#BBFFEE</td><td height="30" width="95" bgcolor="#77ffcc">#77FFCC</td><td height="30" width="95" bgcolor="#33ffaa">#33FFAA</td><td height="30" width="95" bgcolor="#00ff99">#00FF99</td><td height="30" width="95" bgcolor="#00dd77">#00DD77</td><td height="30" width="95" bgcolor="#00aa55">#00AA55</td><td height="30" width="95" bgcolor="#008844">#008844</td></tr><tr><td height="30" width="95" bgcolor="#aaffee">#AAFFEE</td><td height="30" width="95" bgcolor="#77ffee">#77FFEE</td><td height="30" width="95" bgcolor="#33ffdd">#33FFDD</td><td height="30" width="95" bgcolor="#00ffcc">#00FFCC</td><td height="30" width="95" bgcolor="#00ddaa">#00DDAA</td><td height="30" width="95" bgcolor="#00aa88">#00AA88</td><td height="30" width="95" bgcolor="#008866">#008866</td></tr><tr><td height="30" width="95" bgcolor="#99ffff">#99FFFF</td><td height="30" width="95" bgcolor="#66ffff">#66FFFF</td><td height="30" width="95" bgcolor="#33ffff">#33FFFF</td><td height="30" width="95" bgcolor="#00ffff">#00FFFF</td><td height="30" width="95" bgcolor="#00dddd">#00DDDD</td><td height="30" width="95" bgcolor="#00aaaa">#00AAAA</td><td height="30" width="95" bgcolor="#008888">#008888</td></tr><tr><td height="30" width="95" bgcolor="#cceeff">#CCEEFF</td><td height="30" width="95" bgcolor="#77ddff">#77DDFF</td><td height="30" width="95" bgcolor="#33ccff">#33CCFF</td><td height="30" width="95" bgcolor="#00bbff">#00BBFF</td><td height="30" width="95" bgcolor="#009fcc">#009FCC</td><td height="30" width="95" bgcolor="#0088a8">#0088A8</td><td height="30" width="95" bgcolor="#007799">#007799</td></tr><tr><td height="30" width="95" bgcolor="#ccddff">#CCDDFF</td><td height="30" width="95" bgcolor="#99bbff">#99BBFF</td><td height="30" width="95" bgcolor="#5599ff">#5599FF</td><td height="30" width="95" bgcolor="#0066ff">#0066FF </td> <td height="30" width="95" bgcolor="#0044bb">#0044BB </td> <td height="30" width="95" bgcolor="#003c9d">#003C9D </td> <td height="30" width="95" bgcolor="#003377">#003377 </td> </tr><tr><td height="30" width="95" bgcolor="#ccccff">#CCCCFF</td><td height="30" width="95" bgcolor="#9999ff">#9999FF</td><td height="30" width="95" bgcolor="#5555ff">#5555FF </td> <td height="30" width="95" bgcolor="#0000ff">#0000FF </td> <td height="30" width="95" bgcolor="#0000cc">#0000CC </td> <td height="30" width="95" bgcolor="#0000aa">#0000AA </td> <td height="30" width="95" bgcolor="#000088">#000088 </td> </tr><tr><td height="30" width="95" bgcolor="#ccbbff">#CCBBFF</td><td height="30" width="95" bgcolor="#9f88ff">#9F88FF</td><td height="30" width="95" bgcolor="#7744ff">#7744FF </td> <td height="30" width="95" bgcolor="#5500ff">#5500FF </td> <td height="30" width="95" bgcolor="#4400cc">#4400CC </td> <td height="30" width="95" bgcolor="#2200aa">#2200AA </td> <td height="30" width="95" bgcolor="#220088">#220088 </td> </tr><tr><td height="30" width="95" bgcolor="#7700ff">#7700FF </td><td height="30" width="95" bgcolor="#5500dd">#5500DD </td><td height="30" width="95" bgcolor="#4400b3">#4400B3 </td><td height="30" width="95" bgcolor="#3a0088">#3A0088 </td></tr><tr><td height="30" width="95" bgcolor="#e8ccff">#E8CCFF</td><td height="30" width="95" bgcolor="#d28eff">#D28EFF</td><td height="30" width="95" bgcolor="#b94fff">#B94FFF </td><td height="30" width="95" bgcolor="#9900ff">#9900FF </td><td height="30" width="95" bgcolor="#7700bb">#7700BB </td><td height="30" width="95" bgcolor="#66009d">#66009D </td><td height="30" width="95" bgcolor="#550088">#550088 </td></tr><tr><td height="30" width="95" bgcolor="#f0bbff">#F0BBFF</td><td height="30" width="95" bgcolor="#e377ff">#E38EFF</td><td height="30" width="95" bgcolor="#d93eff">#E93EFF </td><td height="30" width="95" bgcolor="#cc00ff">#CC00FF </td><td height="30" width="95" bgcolor="#a500cc">#A500CC </td><td height="30" width="95" bgcolor="#7a0099">#7A0099 </td><td height="30" width="95" bgcolor="#660077">#660077 </td></tr><tr><td height="30" width="95" bgcolor="#ffb3ff">#FFB3FF</td><td height="30" width="95" bgcolor="#ff77ff">#FF77FF</td><td height="30" width="95" bgcolor="#ff3eff">#FF3EFF </td><td height="30" width="95" bgcolor="#ff00ff">#FF0 0FF </td><td height="30" width="95" bgcolor="#cc00cc">#CC00CC </td><td height="30" width="95" bgcolor="#990099">#990099 </td><td height="30" width="95" bgcolor="#770077">#770077 </td></tr></tbody></table></p><p id="color_rgb">颜⾊还可以使⽤rgb(255,0,255)的⽅式</p><p id="color_pellucidity">使⽤rgba(255,0,255,0.6)最后⼀位设置透明度,取值0-1,</p></body></html>View Code注意:可使⽤复合属性font,设置字体相关属性值,不同属性值之间使⽤空格隔开。
css属性⼤全中⽂对照表Aalign-content 规定弹性容器内的⾏之间的对齐⽅式,当项⽬不使⽤所有可⽤空间时。
align-items 规定弹性容器内项⽬的对齐⽅式。
align-self 规定弹性容器内所选项⽬的对齐⽅式。
all 重置所有属性(除了 unicode-bidi 和 direction)。
animation 所有 animation-* 属性的简写属性。
animation-delay 规定开始动画的延迟。
animation-direction 规定动画是向前播放、向后播放还是交替播放。
animation-duration 规定动画完成⼀个周期应花费的时间。
animation-fill-mode 规定元素在不播放动画时(在开始之前、结束之后、或同时)的样式。
animation-iteration-count 规定动画的播放次数。
animation-name 规定 @keyframes 动画的名称。
animation-play-state 规定动画是播放还是暂停。
animation-timing-function 规定动画的速度曲线。
Bbackface-visibility 定义当⾯对⽤户时元素的背⾯是否应可见。
background 所有 background-* 属性的简写属性。
background-attachment 设置背景图像是与页⾯的其余部分⼀起滚动还是固定的。
background-blend-mode 规定每个背景图层(颜⾊/图像)的混合模式。
background-clip 定义背景(颜⾊或图像)应在元素内延伸的距离。
background-color 规定元素的背景⾊。
background-image 规定元素的⼀幅或多幅背景图像。
background-origin 规定背景图像的初始位置。
background-position 规定背景图像的位置。
background-repeat 设置是否以及如何重复背景图像。
CSS属性大全完整版字体属性:(font)大小font-size:x-large; (特大) xx-small; (极小)一般中文用不到,只要用数值就可以,单位:PX、PD 样式font-style:oblique; (偏斜体) italic; (斜体) normal; (正常) 行高line-height:normal; (正常) 单位:PX、PD、EM粗细font-weight:bold; (粗体) lighter; (细体) normal; (正常)变体font-variant:small-caps; (小型大写字母) normal; (正常)大小写text-transform:capitalize; (首字母大写) uppercase; (大写)lowercase; (小写) none; (无)修饰text-decoration:underline; (下划线) overline; (上划线)line-through; (删除线) blink; (闪烁)常用字体font-family:"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana背景属性:(background)色彩background-color: #FFFFFF;图片background-image: url();重复background-repeat: no-repeat;滚动background-attachment:fixed; (固定) scroll; (滚动)位置background-position:Left (水平) top (垂直);简写方法background:#000 url(..) repeat fixed left top;区块属性:(Block)字间距letter-spacing: normal; 数值对齐text-align:justify; (两端对齐) left; (左对齐)right; (右对齐) center; (居中)缩进text-indent: 数值px;垂直对齐vertical-align:baseline; (基线) sub; (下标) super; (下标)text-top; 文本顶端对齐| middle; 居中|bottom; 底部| text-bottom; 相对文本底端对齐词间距word-spacing: normal; 数值空格white-space:pre; (保留) nowrap; (不换行)显示display:block; (块) inline; (内嵌) list-item; (列表项)run-in; (追加部分) compact; (紧凑) marker; (标记)table; 表格inline-table; 内嵌表格table-raw-group;table-header-group; table-footer-group; table-raw;table-column-group; table-column; table-cell;table-caption; (表格标题)方框属性:(Box)width:; 宽height:; 高float:; 浮动clear:both; 清除浮动margin:; 外边距padding:; 内边距顺序:上右下左边框属性:(Border)border-style:dotted; (点线) dashed; (虚线) solid; (实线)double; (双线) groove; (槽线) ridge; (脊状)inset; (凹陷) outset; (外凸)border-width:; 边框宽度border-color:#; 边框颜色简写方法border:width style color;列表属性:(List-style)类型list-style-type:disc; (圆点) circle; (圆圈) square; (方块) decimal; (数字) lower-roman; (小写罗码数字) upper-roman; (大写罗码数字)lower-alpha; (小写字母) upper-alpha; (大写字母)位置list-style-position:outside; (外) inside; (里)图像list-style-image: url(..);定位属性:(Position)位置Position:absolute; 绝对位置|relative; 相对位置|static; 静止可见性visibility:inherit; 继承父元素| visible; 可见| hidden; 隐藏内容超出时overflow:visible; 可见| hidden; 隐藏| scroll; 滚动| auto; 自动裁切clip: rect(12px,auto,12px,auto)css属性代码大全一CSS文字属性:color : #999999; /*文字颜色*/font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/letter-spacing : 1pt; /*字间距离*/line-height : 200%; /*设置行高*/font-weight:bold; /*文字粗体*/vertical-align:sub; /*下标字*/vertical-align:super; /*上标字*/text-decoration:line-through; /*加删除线*/ text-decoration: overline; /*加顶线*/text-decoration:underline; /*加下划线*/ text-decoration:none; /*删除链接下划线*/ text-transform : capitalize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : lowercase; /*英文小写*/ text-align 水平对齐text-align:right; /*文字右对齐*/text-align:left; /*文字左对齐*/text-align:center; /*文字居中对齐*/text-align:justify; /*文字分散对齐*/ vertical-align 垂直对齐vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/vertical-align:middle; /*垂直居中对齐*/vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/二、CSS边框空白padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白/三、CSS符号属性:list-style-type:none; /*不编号*/list-style-type:decimal; /*阿拉伯数字*/list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/list-style-type:upper-alpha; /*大写英文字母*/list-style-type:disc; /*实心圆形符号*/list-style-type:circle; /*空心圆形符号*/list-style-type:square; /*实心方形符号*/list-style-image:url(/dot.gif); /*图片式符号*/list-style-position: outside; /*凸排*/list-style-position:inside; /*缩进*/四、CSS背景样式:background-color:#F5E2EC; /*背景颜色*/ background:transparent; /*透视背景*/background-image : url(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/ background-repeat : repeat-y; /*在y轴重复排列*/指定背景位置background-position : 90% 90%; /*背景图片x与y轴的位置*/ background-position : top; /*向上对齐*/background-position : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/五、CSS连接属性:a /*所有超链接*/a:link /*超链接文字格式*/a:visited /*浏览过的链接文字格式*/a:active /*按下链接的格式*/a:hover /*鼠标经过链接*/鼠标光标样式:链接手指CURSOR: hand十字体cursor:crosshair箭头朝下cursor:s-resize十字箭头cursor:move箭头朝右cursor:move加一问号cursor:help箭头朝左cursor:w-resize箭头朝上cursor:n-resize箭头朝右上cursor:ne-resize箭头朝左上cursor:nw-resize文字I型cursor:text箭头斜右下cursor:se-resize箭头斜左下cursor:sw-resize漏斗cursor:wait光标图案(IE6) p {cursor:url("光标文件名.cur"),text;}六、CSS框线一览表:border-top : 1px solid #6699cc; /*上框线*/border-bottom : 1px solid #6699cc; /*下框线*/border-left : 1px solid #6699cc; /*左框线*/border-right : 1px solid #6699cc; /*右框线*/以上是建议书写方式,但也可以使用常规的方式如下: border-top-color : #369 /*设置上框线top颜色*/ border-top-width :1px /*设置上框线top宽度*/ border-top-style : solid/*设置上框线top样式*/其他框线样式solid /*实线框*/dotted /*虚线框*/double /*双线框*/groove /*立体内凸框*/ridge /*立体浮雕框*/inset /*凹框*/outset /*凸框*/七、CSS表单运用:<div><form><p>用户: <input type="text" class="text"></p>...</form></div>type属性取值单行文本域<p>用户: <input type="text" class="text"></p><input type="text" size="" maxlength="">单行的文本输入区域,size与maxlength属性用来定义此种输入区域显示的尺寸大小与输入的最大字符数多行文本域<p> <textarea cols="45" rows="5"></textarea></p>Cols:字符宽度rows:行数提交重置<p> <input type="submit" id="按钮" value="提交" /><input type="reset" id="重置" value="重置" /></p>提交到服务器的按钮,当这个按钮被点击时,就会连接到表单form属性action指定的url地址。
CSS style属性大全显示:标签属性/属性行为集合事件滤镜方法对象样式一、标签属性属性描述ALIGN align 设置或获取表格排列。
ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。
APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA),以便免除浏览器安全模式。
ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。
BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。
BORDER border 设置或获取框架间的空间,包括3D 边框。
canHaveChildren 获取表明对象是否可以包含子对象的值。
canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。
CLASS className 设置或获取对象的类。
contentWindow 获取指定的frame 或iframe 的window 对象。
DA TAFLD dataFld 设置或获取由dataSrc 属性指定的绑定到指定对象的给定数据源的字段。
DA TASRC dataSrc 设置或获取用于数据绑定的数据源。
disabled 获取表明用户是否可与该对象交互的值。
END end 设置或获取表明元素结束时间的值,或者元素设置为重复的简单持续终止时间。
firstChild 获取对象的childNodes 集合的第一个子对象的引用。
FRAMEBORDER frameBorder 设置或获取是否显示框架的边框。
hasMedia 获取一个表明元素是否为HTML+TIME 媒体元素的Boolean 值。
HEIGHT height 设置或获取对象的高度。
HIDEFOCUS hideFocus 设置或获取表明对象是否显式标明焦点的值。
HSPACE hspace 设置或获取对象的水平边距。
ID id 获取标识对象的字符串。
CSS 列表属性属性名称属性含义属性值字体属性 font-family使用什么字体使用什么字体 所有的字体所有的字体font-style 字体是否斜体字体是否斜体 Normal Normal、、italic italic、、oblique font-variant 是否用小体大写是否用小体大写 Normal Normal、、small-capsfont-weight 字体的粗细字体的粗细 Normal Normal、、bold bold、、bolder bolder、、lithter 等 font-size 字体的大小字体的大小 Absolute-size Absolute-size、、relative-size relative-size、、length length、、percentage 等 颜色和背景属性Color定义前景色定义前景色 颜色颜色 Background-color 定义背景色定义背景色 颜色颜色 Background-image 定义背景图案定义背景图案 路径路径Background-repeat 重复方式重复方式 Repeat-x Repeat-x、、repeat-y repeat-y、、no-repeat Background-attachment 设置滚动设置滚动 Scroll Scroll、、FixedBackground-position 初始位置初始位置 Percentage Percentage、、length length、、top top、、left left、、right right、、bottom 等文本属性 Word-spacing 单词之间的间距单词之间的间距 Normal <length> Letter-spacing 字母之间的间距字母之间的间距 同上同上Text-decoration 文字的装饰文字的装饰 None|underline|overline|line-through|blink| Vertical-align垂直方向的位置垂直方向的位置 Baseline|sub|super|top|text-top|middle|bottom|text-bottom| Text-transform 文本转换文本转换 Capitalize|uppercase|lowercase|none Text-align 文本排列文本排列 Left|right|center|justify Text-indent首行的缩进方式首行的缩进方式 <length>|<percentage> Line-height 文本的行高文本的行高 Normal|<number>|<length>|<percentage> Whihe-space 处理空白处理空白 Unicode-bidi 与diretion文本反排文本反排边距属性Margin-top 顶端边距顶端边距 Length|percentage|auto Margin-right右侧边距右侧边距 同上同上 Margin-bottom 底端边距底端边距 同上同上 Margin-left 左侧边距左侧边距 同上同上填充距属性Padding-top 顶端填充距顶端填充距 Length|percentage Padding-right 右侧填充距右侧填充距 同上同上 Padding-bottom 底端填充距底端填充距 同上同上 Padding-left 左侧填充距左侧填充距 同上同上边框属性.Border-top-width 顶端边框宽度顶端边框宽度 Thin|medium|thick|length Border-right-width 右侧边框宽度右侧边框宽度 同上同上 Border-bottom-width 底端边框宽度底端边框宽度 同上同上 Border-left-width 左侧边框宽度左侧边框宽度 同上同上 Border-width一次定义宽度一次定义宽度同上同上边框属性.边框属性Border-color 设置边框颜色设置边框颜色 ColorBorder-style 设置边框样式设置边框样式 None|dotted|dash|solid等Border-top 一次定义顶端一次定义顶端 Border-top-width|color等Border-right 一次定义右侧一次定义右侧 同上同上Border-bottom 一次定义底端一次定义底端 同上同上Border-left 一次定义左侧一次定义左侧 同上同上Width 定义宽度属性定义宽度属性 Length|percentage|auto Height 定义高度属性定义高度属性 Length|autoFloat 文字环绕文字环绕 Left|right|noneClear 哪一边环绕哪一边环绕 Left|right|none|both分级属性Display 定义是否显示定义是否显示 BlockBlock、、inlineinline、、list-itemlist-item、、none White-space 怎样处理空白怎样处理空白 NormalNormal、、prepre、、nowrapList-style-type 加项目编号加项目编号 DiscDisc、、circlecircle、、square等List-style-image 加图案加图案 <url>|noneList-style-position 第二行起始位置第二行起始位置 InsideInside、、outsideList-style 一次定义列表一次定义列表 <keyword>|<position> |<url>鼠标属性自动自动 Auto定位“十”字定位“十”字 Crosshair 默认指针默认指针 Default手形手形 Hand移动移动 Move箭头朝右方箭头朝右方 e-resize 箭头朝右上方箭头朝右上方 Ne-resize 箭头朝左上方箭头朝左上方 Nw-resize 箭头朝上方箭头朝上方 n-resize 箭头朝右下方箭头朝右下方 Se-resize 箭头朝左下方箭头朝左下方 Sw-resize 箭头朝下方箭头朝下方 s-resize 箭头朝左方箭头朝左方 w-resize 文本“I”形文本“I”形 Text等待等待 Wait帮助帮助 Help。
CSS常用样式属性大全1. 文本属性- `color`:设置文本颜色- `font-size`:设置字体大小- `font-family`:设置字体系列- `font-weight`:设置字体粗细- `text-align`:设置文本对齐方式- `text-decoration`:设置文本装饰(如下划线、删除线等)- `text-transform`:设置文本大小写转换2. 背景属性- `background-color`:设置背景颜色- `background-image`:设置背景图片- `background-repeat`:设置背景图片的重复方式- `background-position`:设置背景图片的位置- `background-size`:设置背景图片的尺寸3. 边框属性- `border`:设置元素边框样式、宽度和颜色- `border-radius`:设置元素边框的圆角- `border-color`:设置元素边框的颜色- `border-width`:设置元素边框的宽度4. 布局属性- `display`:设置元素的显示方式(如块级、内联等)- `width`:设置元素的宽度- `height`:设置元素的高度- `margin`:设置元素外边距- `padding`:设置元素内边距- `float`:设置元素的浮动方式5. 盒模型属性- `box-sizing`:设置元素的盒模型计算方式- `overflow`:设置元素溢出内容的处理方式- `position`:设置元素的定位方式- `top`:设置定位元素的上边距- `bottom`:设置定位元素的下边距- `left`:设置定位元素的左边距- `right`:设置定位元素的右边距以上是CSS中常用的样式属性,通过合理使用这些属性可以实现各种各样的页面效果。
在编写CSS代码时,建议将样式属性单独分行展示,以增加代码的可读性和维护性。
css属性大全CSS属性大全。
CSS(Cascading Style Sheets)是一种用来为网页添加样式和布局的样式表语言。
它可以控制网页的字体、颜色、间距、边框、背景等各种样式,是网页设计中不可或缺的一部分。
在这篇文档中,我们将详细介绍CSS中的各种属性,帮助您更好地掌握CSS的应用。
1. 字体属性。
字体属性用于设置网页中文本的字体样式、大小、粗细等。
常用的属性包括font-family(设置字体系列)、font-size(设置字体大小)、font-weight(设置字体粗细)、font-style(设置字体样式)等。
2. 文本属性。
文本属性用于设置文本的对齐方式、行高、间距等。
常用的属性包括text-align(设置文本对齐方式)、line-height(设置行高)、letter-spacing(设置字符间距)、word-spacing(设置单词间距)等。
3. 背景属性。
背景属性用于设置网页元素的背景样式。
常用的属性包括background-color(设置背景颜色)、background-image(设置背景图片)、background-repeat(设置背景重复方式)、background-position(设置背景位置)等。
4. 边框属性。
边框属性用于设置网页元素的边框样式。
常用的属性包括border-width(设置边框宽度)、border-style(设置边框样式)、border-color(设置边框颜色)、border-radius(设置边框圆角)等。
5. 盒模型属性。
盒模型属性用于设置网页元素的尺寸、内边距、外边距等。
常用的属性包括width(设置元素宽度)、height(设置元素高度)、padding(设置内边距)、margin(设置外边距)等。
6. 定位属性。
定位属性用于设置网页元素的位置。
常用的属性包括position(设置定位方式)、top(设置元素顶部位置)、left(设置元素左侧位置)、z-index(设置元素层级)等。
[背景]属性共有六项:「背景颜色」(background-color),设置背景颜色。
「背景图像」(background-image),设置网页背景图像。
「重复」(background-repeat),控制背景图像的平铺方式,有不重复(no-repeat)、重复(repeat,沿水平、垂直方向平铺)、横向重复(repeat-X,图像沿水平方向平铺)和纵向重复(repeat-Y,沿图像垂直方向平铺)等4种选择。
「附加」(background-attachment),用于控制背景图像是否会随页面的滚动而一起滚动。
有固定(fixd,文字滚动时,背景图像保质固定)和滚动(scroll,背景图像随文字内容一起滚动)两种选择。
「水平位置」/「垂直位置」(background-position),确定背景图像的水平、垂直位置。
共有左对齐(left)、右对齐(right)、顶部(top)、底部(bottom)、居中(center)和值(自定义背景图像的起点位置,可使用户对背景图像的位置做出更精确的控制)等6种选择。
[类型]属性共有九项:「字体」(font-family),设定时,需考虑浏览器中有无该字体。
「大小」(font-size),注意度量单位。
「粗细」(font-weight),除了normal(正常)、bold(粗体)、bolder(特粗)、lighter(细体)外,还有9种以像素为度量为单位的设置方式。
「样式」(font-style),也就是字型。
「行高」(line-height),就是行距。
注意,行距只能以是字体大小值为「变形」(font-variant),可以将正常文字一半尺寸后大写显示,但IE目前不支持这项属性。
「大小写」(text-transform),这项属性能轻而易举地控制字母大小写,有首字大写(capitalize、大写(uppercase)、小写(lowercase)和无(none,使所有继承文字和变形参数被忽略,文字将以正常形式显示)等4种。
「修饰」(text-decoration),用于控制链接文本的显示形态,有下划线(underline)、无下划线(overline)、删除线(line-through)、闪烁(blink)和无(none ,使上述效果均不会发生)等5种修饰方式。
但IE4不支持文字闪烁。
[区块]属性共有六项:「单词间距」(word-spacing),主要用于控制文字间相隔的距离。
有正常(normal)和值(自定义间隔值)两种选择方式。
当选择值时,可用的单位有英吋(in)、厘米(cm)、毫米(mm)、点数(pt)、12pt字(pc)、字体高(em)、字体x有高(ex)像素(px)。
「字母间距」(letter-spacing),其作用与字符间距类似,也有正常(normal)和值(自定义间隔值)两种选择方式。
「垂直对齐」(vertical-align),控制文字或图像相对于其母体元素的垂直位置。
如将一个2×3像素的GIF图像同其母体元素文字的顶部垂直对齐,则该GIF图像将在该行文字的顶部显示。
共有基线(baseline,将元素的基准线同母体元素的基准线对齐)、下标(sub,将元素以下标的形式显示),上标(super,将元素以上标的形式显示)、顶部(top ,将元素顶部同最高的母体元素对齐)、文本顶对齐(text-top,将元素的顶部同母体元素文字的顶部对齐)、中线对齐(middle,将元素的中点同母体元素的中点对齐)、底部(bottom,将元素的底部同最低的母体元素对齐)及值(自定义)等9种选择。
「文本对齐」(text-align),设置块的水平对齐方式。
共有左对齐(left)、右对齐(right)、居中(center)和均分(justify)等4种选择。
「文字缩进」(text-indent),控制块的缩进程度。
「空白间距」(white-space),在HTML中,空格是被省略的;在CSS中则使用属性(white-space)控制空格的输入。
共有正常(normal)、保留(pre)和不换行(nowrap)等3种选择。
[边框]的属性有3项:「宽」(border-width),控制边框的宽度,其中分为4个属性:border-top-width顶边框的宽度、border-right-width右边框的宽度、border-bottom-width底边框的宽度、border-left-width左边框的宽度。
「颜色」(border-color),设置各边框的颜色。
若要使边框的四边显示不同的颜色,可在设置中分别列出。
如,p{: #ff0000 #009900 #0000ff #55cc00}浏览器将四种颜色依次理解为:上边框、右边框、底边框和左边框(自上开始顺时针)。
「样式」(border-style),设定边框的样式,共有无(none)、虚线(dotted)、点划线线(dotted)、点划线(dashed)、实线(solid)、双线(double )、槽状(grove)、脊状(ridge)、凹陷(inset)和凸起(outset)等9种。
「盒子」属性共有6项:「宽」(width),确定盒子本身的宽度,可以使盒子的宽度不依靠它所包含的内容多少。
「高」(height),确定盒子本身的高度。
「浮动」(float),设置块元素的浮动效果。
「清除」(clear),用于清除设置的浮动效果。
「边距」(margin),控制围绕边框的边距大小。
其中包含4个属性:margin-top控制上边距的宽度、margin-right 控制右边距的宽度、margin-bottom控制下边距的宽度、margin-left控制左边距的宽度。
「边界」(padding),确定围绕块元素的空格填充数量,其中包含4个属性「padding-top控制上留白的宽度、padding-right控制右留白的宽度、padding-bottom控制下留白宽度、padding-left控制左留白的宽度。
[列表]属性共有3项:「类型」(list-style-type),确定列表每一项前使用的符号,共有圆点(disc)、圆圈(circle)、方形(square)、数字(decimal)、小写罗马数字(lower-roman )、大写罗马数字(upper-roman)、小写字母(lower-alpha)和大写字母(upper-alpha)等8种。
「项目图像」(list-style-image),其作用是将列表前面的符号换为图形。
「位置」(list-style-position),用于描述列表位置,有内(outside)和外(inside)两种选择。
[定位]属性共有6项:「类型」(position),用于确定定位的类型,共有绝对(absolute)、相对(relative)和静态(static)等3种选择。
「Z轴」(z-index),用于控制网页中块元素的叠放顺序,可为元素设置重叠效果。
该属性的参数值使用纯整数,值为0时,元素在最下层,适用于绝对定位或相对定位的元素。
「显示」(visibility)使用该属性可将网页中的元素隐藏,共有继承(inherit,继承母体要素的可视性设置)、可见(visible)和隐藏(hidden)等3种选择。
「溢出」(overflow),在确定了元素的高度和宽度后,如果元素的面积不能全部显示元素中的内容时,该属性做一日和尚撞一天钟起作用了。
其中共有可见(visible,扩大面积以显示所有内容)、隐藏(hidden,隐藏超出范围的内容)、滚动(scroll,在元素的右边显示一个滚动条)和自动(auto,当内容超出元素面积时,显示滚动条)等4种选择。
「定位」,当为元素确定了绝对定位类型后,该组属性决定元素在网页中的具体位置。
该组属性包含4个子属性,分别是「左」(属性名为「left」,控制元素左边的起始位置)、「上」(属性名为「top」,控制元素上面的起始位置)、「宽」或「高」(与「盒子」类属性面板中「宽」或「高」的属性作用相同)。
「剪辑」(clip),当元素被指定为绝对定位类型后,该属性可以把元素区域切成各种形状,但目前提供的只有方形一种。
属性值为rect(top right bottom left),即:rect(top right bottom left),属性值的单位为任何一种长度单位。
[扩展]属性共有两部分:「分页」,其中两个属性的作用是为打印的页面设置分页符。
「之前」(page-break-before);「之后」(page-break-after)。
「视觉效果」,其中两个属性的作用是为网页中的元素施加特殊效果。
「光标」(cusor),可以指定在某个元素上要使用的光标形状,共有15种选择方式,分别代表鼠标在Windows操作系统中的各种形状。
另外它还可以指定指针图标的URL地址;「滤镜」(fiter),可以为网页中元素施加各种奇妙的滤镜效果,共包含有16种滤镜。
大小font-size: x-large;(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX、PD样式font-style: oblique;(偏斜体) italic;(斜体) normal;(正常)行高line-height: normal;(正常) 单位:PX、PD、EM粗细font-weight: bold;(粗体) lighter;(细体) normal;(正常)变体font-variant: small-caps;(小型大写字母) normal;(正常)大小写text-transform: capitalize;(首字母大写) uppercase;(大写) lowercase;(小写) none;(无)修饰text-decoration: underline;(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁)常用字体:(font-family)"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana背景属性:(background)色彩background-color: #FFFFFF;图片background-image: url();重复background-repeat: no-repeat;滚动background-attachment: fixed;(固定) scroll;(滚动)位置background-position: left(水平) top(垂直);简写方法background:#000 url(..) repeat fixed left top;区块属性:(Block)字间距letter-spacing: normal; 数值对刘text-align: justify;(两端对齐) left;(左对齐) right;(右对齐) center;(居中)缩进text-indent: 数值px;垂直对齐vertical-align: baseline;(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom;词间距word-spacing: normal; 数值空格white-space: pre;(保留) nowrap;(不换行)显示display:block;(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题)方框属性:(Box)width:; height:; float:; clear:both; margin:; padding:; 顺序:上右下左边框属性:(Border)border-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;border-width:; 边框宽度border-color:#;简写方法border:width style color;列表属性:(List-style)类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;位置list-style-position: outside;(外) inside;图像list-style-image: url(..);定位属性:(Position)Position: absolute; relative; static;visibility: inherit; visible; hidden;overflow: visible; hidden; scroll; auto;clip: rect(12px,auto,12px,auto) (裁切)css属性代码大全一CSS文字属性:color : #999999; /*文字颜色*/font-family : 宋体,sans-serif; /*文字字体*/font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/letter-spacing : 1pt; /*字间距离*/line-height : 200%; /*设置行高*/font-weight:bold; /*文字粗体*/vertical-align:sub; /*下标字*/vertical-align:super; /*上标字*/text-decoration:line-through; /*加删除线*/text-decoration: overline; /*加顶线*/text-decoration:underline; /*加下划线*/text-decoration:none; /*删除链接下划线*/text-transform : capitalize; /*首字大写*/text-transform : uppercase; /*英文大写*/text-transform : lowercase; /*英文小写*/text-align:right; /*文字右对齐*/text-align:left; /*文字左对齐*/text-align:center; /*文字居中对齐*/text-align:justify; /*文字分散对齐*/vertical-align属性vertical-align:top; /*垂直向上对齐*/vertical-align:bottom; /*垂直向下对齐*/vertical-align:middle; /*垂直居中对齐*/vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/padding-left:10px; /*左边框留空白三、CSS符号属性:list-style-type:none; /*不编号*/list-style-type:decimal; /*阿拉伯数字*/list-style-type:lower-roman; /*小写罗马数字*/list-style-type:upper-roman; /*大写罗马数字*/list-style-type:lower-alpha; /*小写英文字母*/list-style-type:upper-alpha; /*大写英文字母*/list-style-type:disc; /*实心圆形符号*/list-style-type:circle; /*空心圆形符号*/list-style-type:square; /*实心方形符号*/list-style-image:url(/dot.gif); /*图片式符号*/list-style-position: outside; /*凸排*/list-style-position:inside; /*缩进*/四、CSS背景样式:background-color:#F5E2EC; /*背景颜色*/ background:transparent; /*透视背景*/ background-image : url(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/background-repeat : repeat-y; /*在y轴重复排列*/指定背景位置background-position : 90% 90%; /*背景图片x与y轴的位置*/ background-position : top; /*向上对齐*/background-position : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/五、CSS连接属性:a /*所有超链接*/a:link /*超链接文字格式*/a:visited /*浏览过的链接文字格式*/a:active /*按下链接的格式*/a:hover /*鼠标转到链接*/鼠标光标样式:链接手指CURSOR: hand十字体cursor:crosshair箭头朝下cursor:s-resize十字箭头cursor:move箭头朝右cursor:move加一问号cursor:help箭头朝左cursor:w-resize箭头朝上cursor:n-resize箭头朝右上cursor:ne-resize箭头朝左上cursor:nw-resize文字I型cursor:text箭头斜右下cursor:se-resize箭头斜左下cursor:sw-resize漏斗cursor:wait光标图案(IE6) p {cursor:url("光标文件名.cur"),text;}六、CSS框线一览表:border-top : 1px solid #6699cc; /*上框线*/border-bottom : 1px solid #6699cc; /*下框线*/border-left : 1px solid #6699cc; /*左框线*/border-right : 1px solid #6699cc; /*右框线*/以上是建议书写方式,但也可以使用常规的方式如下:border-top-color : #369 /*设置上框线top颜色*/border-top-width :1px /*设置上框线top宽度*/border-top-style : solid/*设置上框线top样式*/其他框线样式solid /*实线框*/dotted /*虚线框*/double /*双线框*/groove /*立体内凸框*/ridge /*立体浮雕框*/inset /*凹框*/outset /*凸框*/七、CSS表单运用:文字方块按钮复选框选择钮多行文字方块下拉式菜单选项1选项2八、CSS边界样式:margin-top:10px; /*上边界*/margin-right:10px; /*右边界值*/margin-bottom:10px; /*下边界值*/margin-left:10px; /*左边界值*/CSS 属性:字体样式(Font Style)序号中文说明标记语法1 字体样式{font:font-style font-variant font-weight font-size font-family}2 字体类型{font-family:"字体1","字体2","字体3",...}3 字体大小{font-size:数值|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small}4 字体风格{font-style:inherit|italic|normal|oblique}5 字体粗细{font-weight:100-900|bold|bolder|lighter|normal;}6 字体颜色{color:数值;}7 阴影颜色{text-shadow:16位色值}8 字体行高{line-height:数值|inherit|normal;}9 字间距{letter-spacing:数值|inherit|normal}10 单词间距{word-spacing:数值|inherit|normal}11 字体变形{font-variant:inherit|normal|small-cps }12 英文转换{text-transform:inherit|none|capitalize|uppercase|lowercase}13 字体变形{font-size-adjust:inherit|none}14 字体{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}文本样式(Text Style)序号中文说明标记语法1 行间距{line-height:数值|inherit|normal;}2 文本修饰{text-decoration:inherit|none|underline|overline|line-through|blink}3 段首空格{text-indent:数值|inherit}4 水平对齐{text-align:left|right|center|justify}5 垂直对齐{vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}6 书写方式{writing-mode:lr-tb|tb-rl}背景样式序号中文说明标记语法1 背景颜色{background-color:数值}2 背景图片{background-image: url(URL)|none}3 背景重复{background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}4 背景固定{background-attachment:fixed|scroll}5 背景定位{background-position:数值|top|bottom|left|right|center}6 背影样式{background:背景颜色|背景图象|背景重复|背景附件|背景位置}框架样式(Box Style)序号中文说明标记语法1 边界留白{margin:margin-top margin-right margin-bottom margin-left}2 补白{padding:padding-top padding-right padding-bottom padding-left}3 边框宽度{border-width:border-top-width border-right-width border-bottom-width border-left-width}宽度值:thin|medium|thick|数值4 边框颜色{border-color:数值数值数值数值}数值:分别代表top、right、bottom、left颜色值5 边框风格{border-style:none|hidden|inherit|dashed|solid|double|inset|outset|ridge|groove}6 边框{border:border-width border-style color}上边框{border-top:border-top-width border-style color}右边框{border-right:border-right-width border-style color}下边框{border-bottom:border-bottom-width border-style color}左边框{border-left:border-left-width border-style color}7 宽度{width:长度|百分比| auto}8 高度{height:数值|auto}9 漂浮{float:left|right|none}10 清除{clear:none|left|right|both}分类列表序号中文说明标记语法1 控制显示{display:none|block|inline|list-item}2 控制空白{white-space:normal|pre|nowarp}3 符号列表{list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none}4 图形列表{list-style-image:URL}5 位置列表{list-style-position:inside|outside}6 目录列表{list-style:目录样式类型|目录样式位置|url}7 鼠标形状{cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}。