康盛博客

[作用]:设置边框的样式，常用使用border:1px solid #000的形式，这里的第二个参数就是border-style
[格式]:border-style:值1 | 值2 |值3 |值4
[取值范围]:none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
[示例]:
#header{border-style:solid;} /*当只有一个值时，这个边框的四条边将拥有相同的取值*/
#header{border-style:solid dashed;} /*当只有二个值时，第一个值用于上-下边框，第二个用于左-右边框*/
#header{border-style:solid dotted double;} /*当只有三个值时，第一个用于上边框，第二个用于左－右边框，第三个用于下边框*/
#header{border-style:solid dashed double dotted;} /*当有四个值时，边框样式将按照上-右-下-左的顺序来显示样式*/
[详解]:
none:默认值。无边框。不受任何指定的 border-width 值影响
hidden:隐藏边框。IE不支持
dotted:在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线
dashed:在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线
solid:实线边框,常用此值来达到表格所实现的边框效果
double:双线边框。
groove:根据 border-color 的值画3D凹槽 /*不常用*/
ridge:根据 border-color 的值画3D凸槽  /*不常用*/
inset:根据 border-color 的值画3D凹边  /*不常用*/
outset:根据 border-color 的值画3D凸边 /*不常用*/
[效果]:
1.border-style:solid;

2.border-style:solid dashed;

3.border-style:solid dotted double;

4.border-style:solid dashed double dotted;

在怎样在HTML中使用css一节中我们有提到样式的优先级的问题，那么本篇就来使用简单的示例来说明下外部样式表、内部样式表、内联样式优先级的问题。

首先我们要看看外部样式表文件的写法–新建一个css样式文件：priority.css，内容如下：
p{font-size:12px;color:#FF0000;}
在priority.css同目录下新建一个html文件，内容如下:

此时的样式效果如下：

添加内部样式表样式时的文件如下：

此时的样式效果如下：

添加内联样式时的文件如下：

此时的样式效果如下：

相信通过对这个示例的理解，你已经对这三种方式的优先级问题已经很了解了。

←返回css