1. 概述
A. 任何块元素和行内元素都可以设置边框
B. 如果元素要显示边框，必须同时设置以下三个属性才可以：border-width（边框宽度）、border-style（外观）、border-color（边框颜色）。
2. border-width（边框宽度）
A. 该属性值要设置为像素值，即xxpx（20px等）。
3. border-style（外观）
A. 该属性可以取以下值：
none：无样式
hidden：与“none”相同
solid：实线
dashed：虚线
dotted：点线
double：双线，双线的宽度加上中间的空隙宽度等于border-width值
inset：内凹（3D样式）
outset：外凸（3D样式）
ridge：脊线（3D样式）
groove：槽线（3D样式）
B. 除了solid和dashed，其他取值都不常用
4. border-color
A. 该属性值可以设置为关键字（red、green等），也可以设置为rgb数值（#3EF0A4）。
e.g. <head>
<title>边框</title>
<style type="text/css">
input {
border-width: 6px;
border-style: solid;
border-color: red;
}
</style>
</head>
<body>
<input type="button" value="点击一下" />
</body>
5. 边框的简洁写法
e.g. <head>
<title>边框</title>
<style type="text/css">
input {
/* border-width、border-style和border-color这三个属性不分顺序 */
border: green 6px solid;
}
</style>
</head>
<body>
<input type="button" value="点击一下" />
</body>
6. 边框局部样式
A. 指上边框、下边框、左边框和右边框的样式。
B. border-top/bottom/left/right-width、border-top/bottom/left/right-style、border-top/bottom/left/right-color。
C. 简洁写法为border-top/bottom/left/right
293
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
