无边框 : border-style: none; 虚线边框 : 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: hidden; 边框宽度 : border-width: ?px; 边框颜色 : border-color:?;


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>边款</title>
<link rel="stylesheet" href="demo.css">
</head>

<body>
<p class="none">无边框。</p>
<p class="dotted">虚线边框。</p>
<p class="dashed">虚线边框。</p>
<p class="solid">实线边框。</p>
<p class="double">双边框。</p>
<p class="groove"> 凹槽边框。</p>
<p class="ridge">垄状边框。</p>
<p class="inset">嵌入边框。</p>
<p class="outset">外凸边框。</p>
<p class="hidden">隐藏边框。</p>
</body>
/*边框*/
p.none {
border-style: none;
}

p.dotted {
border-style: dotted;
}

p.dashed {
border-style: dashed;
}

p.solid {
border-style: solid;
border-width:13px;
border-color:red;
}

p.double {
border-style: double;
}

p.groove {
border-style: groove;
}

p.ridge {
border-style: ridge;
}

p.inset {
border-style: inset;
}

p.outset {
border-style: outset;
}

p.hidden {
border-style: hidden;
}