3.4 边框属性border
作者:蛛蛛虎 日期:2008-07-02
3.4 边框属性border
边框属性用来设置选择符对象的边框风格、线条、颜色等属性。
1）边框风格属性（border-style）
这个属性用来设定上、下、左、右边框的风格，它的值如下：
none（没有边框，无论边框宽度设为多大）。
dotted（点线式边框）。
dashed（破折线式边框）。
solid（直线式边框）。
double（双线式边框）。
groove（槽线式边框）。
ridge（脊线式边框）。
inset（内嵌效果的边框）。
outset（凸起效果的边框）。
演示示例：分别使用none,dotted, dashed, solid, double, groove, ridge, inset, outset的CSS边框风格属性示例
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
2）边框宽度属性（border-width）
这个属性用来设定上下左右边框的宽度，它的值如下：
medium（是默认值）。
thin（比medium细）。
thick（比medium粗）。
用长度单位定值。可以使用绝对长度单位（cm、mm、in、pt、pc）或者用相对长度单位（em、ex、px）。
演示示例：分别用medium, thin, thick和长度单位定制的CSS边框宽度属性示例
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
3）边框颜色属性（border-color）
这个属性用来设定上、下、左、右边框的颜色。例句：
.d5 {border-color:gray;border-style:solid;}
|
演示示例：
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
4）边框属性（border）
这个属性是边框属性的一个快捷的综合写法，它包含border-width、border-style和border-color。例句：
.d1 {border:5px solid gray;}
|
演示示例：
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
5）单边边框属性
上、下、左、右4个边框不但可以统一设定，也可以分开设定。
设定上边框属性，你可以使用border-top、border-top-width、border-top-style、border-top-color。
设定下边框属性，你可以使用border-bottom、border-bottom-width、border-bottom-style、border-bottom-color。
设定左边框属性，你可以使用border-left、border-left-width、border-left-style、border-left-color。
设定上边框属性，你可以使用border-right、border-right-width、border-right-style、border-right-color。
演示示例：设置单边边框属性的示例
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
| 上一节 回书目录 下一节 |
上一篇: 
下一篇: 
文章来自: 
引用通告: 
Tags: 
相关日志: