CSS 属性【DOC精选】.doc

CSS 3属性详解 边框属性 1）、border(边框) 功能：设置对象边框的格式。 语法：border : border-width || border-style || border-color 边框宽度(border-width),边框样式(border-style)，边框颜色(border-color) 属性： border-width 设置对象边框的宽度 medium | thin | thick | length medium :默认值。默认宽度 ；thin :小于默认宽度 ；thick :大于默认宽度 ；length :由浮点数字和单位标识符组成的长度值。不可为负值。对应的脚本特性为 borderWidth 。 border-style 设置对象边框的样式 none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset none :默认值。无边框。不受任何指定的 border-width 值影响dotted :点线。dashed :虚线。solid :实线边框double :双线边框。两条单线与其间隔的和等于指定的 border-widthgroove :根据 border-color 的值画3D凹槽ridge :根据 border-color 的值画3D凸槽inset :根据 border-color 的值画3D凹边outset :根据 border-color 的值画3D凸边 对应的脚本特性为 borderStyle 。 border-color 设置对象边框的颜色 : color color :指定颜色。 默认值将采用文本颜色。如果提供全部四个参数值，将按上－右－下－左的顺序（顺时针）作用于四个边框。如果只提供一个，将用于全部的四条边。如果提供两个，第一个用于上－下，第二个用于左－右。如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。对应的脚本特性为 borderColor 。 附： 附：渐变颜色 引擎类型 Gecko Webkit Presto Border-color -moz-border-color 如果你设置了border的宽度是n px，那么你就可以在这个border上使用n 种颜色，每种颜色显示1px的宽度。如果说你的border的宽度是10个像素，但是只声明了5或6种颜色，那么最后一个颜色将被添加到剩下的宽度。 示例代码： #border_color{ border: 8px solid #F00; -moz-border-colors:#897048 #917953 #a18a66 #b6a488 #c5b59b #d4c5ae #e2d6c4 #eae1d2; padding: 5px; width: 518px; height:158px } 实例：border: 1px solid #F00;（） 相关： border-top ， border-right ， border-bottom ， border-left 2）、outline(轮廓) 功能：外轮廓( outline )画在边框( border )外面，并且不一定是矩形。 语法：outline outline-color outline-style outline-width 属性：同border(边框) 实例：outline:#00F double 2px; 3）、Border-image（图片边框） 功能：边框以图片的格式来显示。 语法：border-image ： none | image | border-width| 重复性 引擎类型 Gecko Webkit Presto Border-image -moz-border-image -webkit-border-image 很多浏览器不支持此属性，Firefox3.5以上、Safari3以上的浏览器支持。 属性与属性值： 1、none 默认值。无背景图。 2. image：边框背景图像的url 地址。（图片源，border-image-source) 3、border-width：边框宽度，边框宽度用来设置图片如何被切割. （图片剪裁位置，border-image-slice)。 number ：边框宽度用固定像素值表示。1到4个数值。 percentage：边框宽度用百分比表示。1到4个数值。 边框宽度用来设置图片如何被切割. 在Border-image中，图片源被切割成九宫格造型border-width有1-4个值，依次表示上、左、下、右，用来表示切