轮廓的样式! | 码农工具

​x
 
<!DOCTYPE html>
<html>
  <head>
    <style>
      p{border:1px solid red;}
      p.dotted {outline-style:dotted;}
      p.dashed {outline-style:dashed;}
      p.solid {outline-style:solid;}
      p.double {outline-style:double;}
      p.groove {outline-style:groove;}
      p.ridge {outline-style:ridge;}
      p.inset {outline-style:inset;}
      p.outset{outline-style:outset;}
    </style>
  </head>
  <body>
​
<p class="dotted">A dotted outline</p>
<p class="dashed">A dashed outline</p>
<p class="solid">A solid outline</p>
<p class="double">A double outline</p>
<p class="groove">A groove outline</p>
<p class="ridge">A ridge outline</p>
<p class="inset">An inset outline</p>
<p class="outset">An outset outline</p>
<b>Note:</b> IE8 supports the outline properties only if a !DOCTYPE is 
specified.
</body>
</html>
HTML