发信人: parislenin()
整理人: eagle(2000-06-03 10:54:14), 站内信件
|
边线属性本来也是属于BOX属性中的一部分，只是由于它的内容太多，所以我
列出来单独讲一下。
顶线宽border-top-width、右线宽border-right-width、底线宽border-bottom-
width、
左线宽border-left-width、线宽border-width
这些属性是用来描述一个元素的四条边框线的样式设置的。它们的取值有无
none、细thin、中等medium、厚thick和指定长度单位length。使用线宽border-
width属性描述的是顶线宽、右线宽、底线宽、左线宽都设置同样的样式。比如：
.tab { border-width: thin }表示所有的 border-*-width 属性都指定为“t
hin”
如果有两个值：H1 { border-width: thin 20pt }表示border-top-width和
border-bottom-width为“thin”，而border-right-width和border-left-width
为20pt。这里要强调的是赋值的顺序是顶线宽、右线宽、底线宽、左线宽，同上
面说的一样不能改变。
如果有三个值H2{border-width: thin 10pt medium}表示border-top-width
的属性为thin，border-right-width和border-left-width为10pt，border-bott
om-width 为medium。把它改为H2 {border-width: thin 10pt medium none}则表
示border-left-width的宽度看不见。
线色border-color、顶线色border-top-color、右线色border-right-color、底
线色border-bottom-color、
左线色border-left-color
要设置线条颜色的样式，首先你要保证线条能看见，也就是线宽大于零。
在使用的方式上它们和线宽border-width的一样，只是取值不一样，它们用
的是颜色。
边线样式border-style、顶边线样式border-top-style、右边线样式border-rig
ht-style、
底边线样式border-bottom-style、左边线样式border-left-style,
使用border-style可以将所有的边线设置为同样的指定样式，如果使用bord
er-*-style便可以单独设置某一条边线的样式，当然做这一切的前提还是必须能
看到边线。边线样式的取值有如下的范围：
none：不管边线宽度是多少，都不显示边线
dotted：点缀，由点组成的直线
dashed：由破折号组成的直线
solid：实线
double：在宽度许可的条件下，将看到两条平行线
groove：如果线条有颜色，将显示一条立体沟槽线
ridge：如果线条有颜色，将显示一条隆起立体线
inset：如果线条有颜色，将显示一条嵌入线
outset：如果线条有颜色，将显示一条立体端线
顶线border-top、右线border-right、底线border-bottom、左线border-left、
线border
当四边的宽度、样式、颜色都一样的时候，border样式属性也可以用来同时
设置四边，比如：
body { border: solid red } 它等同于：
body {border-top: solid red ; border-right: solid red ;
border-bottom: solid red ; border-left: solid red }
并非象margin和padding属性一样，border属性不能将四条边设置为不同的值
，如果要这样做，就必须使用更多的样式表属性参数，比如：border-*-width、
border-*-style、border-*-color等。比如：
table {border-color: red ; border-left: double color: black }
在上面的例子中，左边颜色为黑，其它颜色为红，因为其中的border-left设
置了宽度和颜色。如果颜色的值在左边线属性border-left中没有指定的话，它将
从属性color中取得。
不过border-width属性可以同时设置四条边的宽度。
--
庞磊 ---- 网络安居工程倡导者！
倡导网络安居工程，人人都有一个家！！一切从学会制作网页开始。
>>http://www9000.126.com<<>>http://www9000.cn99.com<<
>>http://www9000.yeah.net<<>>http://www9000.home.china.com<<
>>>>>>>>>>>><<<<<<<<<<<<
※ 来源:．月光软件站 http://www.moon-soft.com．[FROM: 202.98.195.2]
|
|