属性: Border Style
用法:
border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;
定义:
边框的样式可以使用标记border-style来进行设置。边框样式可以取以下的值。
a)dotted-可以创建点线式边框。
b)dashed-可以创建破折线式边框。
c)solid-可以创建直线式边框。
d)double-可以创建双线式边框。
e)groove-可以创建槽线式边框。
f)ridge-可以创建脊线式边框。
g)inset-可以创建内嵌效果的边框。
h)outset-可以创建突起效果的边框。
示例1:
<div style="border-width: 2px; border-style: dotted; border-color: red; ">
testing border style</div>
结果:
测试边界风格
示例2:
<div style="border-width: 2px; border-style: dashed; border-color: red; ">
测试边界风格</div>
结果:
测试边界风格
示例3:
<div style="border-width: 2px; border-style: solid; border-color: red; ">
测试边界风格</div>
结果:
测试边界风格
示例4:
<div style="border-width: 4px; border-style: double; border-color: red; ">
testing border style</div>
结果:
测试边界风格
示例5:
<div style="border-width: 4px; border-style: groove; border-color: red; "> 测试边界风格</div>
结果:
测试边界风格
示例6:
<div style="border-width: 4px; border-style: ridge; border-color: red; "> 测试边界风格 </div>
结果:
测试边界风格
示例7:
<div style="border-width: 4px; border-style: inset; border-color: red; ">
测试边界风格</div>
结果:
测试边界风格
示例8:
<div style="border-width: 4px; border-style: outset; border-color: red; ">
测试边界风格</div>
结果:
测试边界风格
| 
