今天下午看到了一篇关于border属性设置边框的文章,感觉很好很实用,所以就写在了下面:
使用border设置对象的边框属性:
- 名称:border
分类:边框
简述:设置对象边框属性
概述:border 是设置对象边框综合属性的样式(Style)。包括border-width(宽度,即粗细程度)border-style(样式,即实线虚线等)border-color(颜色)。一个对象的border有上下左右四部分,设置border即可同时定义这四部分的属性。
-
border详细说明
- 语法:
border : border-width | border-style | border-color
该属性是复合属性。请参阅各参数对应的属性
取值:
默认值为: medium none 。 border-color 的默认值将采用文本颜色
- 例1:
代码:<div style="border: 2px solid red; width: 300px; height: 100px;">www.panpan.org</div>
显示效果:www.panpan.org- 例2:
代码:<div style="border: 2px dotted green; width: 300px; height: 100px;">www.panpan.org</div>
显示效果:www.panpan.org- 例3:
代码:<div style="border:5px groove blue; width:300px; height:100px;">www.panpan.org</span>
显示效果:www.panpan.org- 例4:
代码:<div style="border: 5px groove blue; width: 300px; height: 100px; border-top:1px inset orange">www.panpan.org</div>
显示效果:www.panpan.org- 例5:
代码:<div style="border: 5px groove blue; width: 300px; height: 100px; border-top:4px ridge orange; border-bottom:none">www.panpan.org</div>
显示效果:www.panpan.org- 说明:
如果提供全部四个参数值,将按上-右-下-左的顺序作用于四个边框。如果只提供一个,将用于全部的四条边。如果提供两个,第一个用于上-下,第二个用于左-右。如果提供三个,第一个用于上,第二个用于左-右,第三个用于下。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
在 IE5.5+ 中,边框属性可以直接应用于内联要素。而在此前的版本中,内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。
- 好了,关于border就说这些,还有不明白的朋友可以联系QQ讨论。