经常在设计文字广告，或者为网站设计右边的公告栏，或者设计底部统计信息板块的时候我们需要好看的边框，特别是网站论坛和个人博客，设计好网站的边框能使网站更有新异。
通过CSS的设置边框的样式border-style，统一网站或者论坛的边框样式，可以达到这一目的。下面简单介绍一下：
border-style属性用于设置边框的样式，
语法如下：
border-style:none | solid | double | dotted | dashed | groove| ridge | inset | outset
说明：
solid 实线；
double 双直线；
dotted 小点虚线；
dashed 大点虚线；
groove 3D凹线；
ridge 3D凸线；
inset 3D框入线；
outset 3D隆起线。
举例说明，下面的边框颜色属性border-color，边框宽度border-width可以随意设计，如果不明白它们的用法，可以通过最下面的相关文章链接来了解：
<html>
<head>
<title>border-style</title>
<style typ="text/css">
<!--
#bs1{border-width:0.1cm;border-color:#ff05ff;border-style:dotted}
#bs2{border-width:0.1cm;border-color:#ff78ff;border-style:solid}
#bs3{border-width:0.1cm;border-color:#ff00ff;border-style:double}
#bs4{border-width:0.1cm;border-color:#ff14ff;border-style:dashed}
#bs5{border-width:0.1cm;border-color:#ff96ff;border-style:groove}
#bs6{border-width:0.1cm;border-color:#ff44ff;border-style:ridge}
#bs7{border-width:0.1cm;border-color:#ff33ff;border-style:inset}
#bs8{border-width:0.1cm;border-color:#ff12ff;border-style:outset}
-->
</sytle>
</head>
<body>
<center>
<h4></h4>
<table border=2>
<tr>td id=bs1>设计border边框样式为小点虚线</td></tr>
<tr>td id=bs2>设计border边框样式为实线</td></tr>
<tr>td id=bs3>设计border边框样式为双直线</td></tr>
<tr>td id=bs4>设计border边框样式为大点虚线</td></tr>
<tr>td id=bs5>设计border边框样式为3D凹线</td></tr>
<tr>td id=bs6>设计border边框样式为3D凸线</td></tr>
<tr>td id=bs7>设计border边框样式为3D框入线</td></tr>
<tr>td id=bs8>设计border框样式为3D隆起线</td></tr>
</table>
</center>
</body>
</html>
本课主题：设计网站边框的样式border-style
相关主题：
网站边框颜色
设计网站的边框宽度
网站设计边界margin
设置网站滚动条
美化网页链接
请拨打热线：0571-86586571