边框样式

「边框样式」border-style：设定边框的样式，公有9种。

没有边框：none

虚线：dotted

点划线线：dotted

点划线：dashed

实线：solid

双线：double 

槽状：grove

脊状：ridge

凹陷：inset

凸起：outset

 

「边框宽度」border-width：控制边框的宽度

border-top-width：顶边框的宽度

border-right-width：右边框的宽度

border-bottom-width：底边框的宽度

border-left-width：左边框的宽度。 

 

「边框颜色」border-color：设置各边框的颜色。

若要使边框的四边显示不同的颜色，可在设置中分别列出。

如，p{: #ff0000 #009900 #0000ff #55cc00} 浏览器将四种颜色依次理解为：上边框、右边框、底边框和左边框。

 

源码：

<div style="width:100px;height:100px;border-style:solid;border-width:2px;border-color:red;"></div> 

效果图：