Border

边框样式

今天来介绍个基本的边框

<p class="solid ">实线</p>
<p class="dashed">虚线</p>
<p class="dotted">点线</p>

我把p的class分别指定到各个css写好的语法

p.solid  {border-style: solid; }
p.dashed {border-style: dashed;}
p.dotted {border-style: dotted;}

他们分别的效果是这样子的

宽度、颜色

p.solid {
  border-style: solid;
  border-width: 5px 10px 5px 10px; /*上 右 下 左*/
  border-color: red;
}

宽度可以帮他指定要多少单位
也能给这三个预定值thin、medium、thick

颜色的话可以直接指定颜色名称
当然也可以使用昨天介绍的颜色使用方法
然後border的属性值那些其实也可以简写
例如写成这样

label.solid {
border: black 5px solid;
}