@jianhua.cheng
border 的使用指南及有趣的应用
May 25, 2016
/* 1像素单位宽度的实心边框 */
border: 1px solid #000;
这是我们经常使用边框时写的代码，接下来清清楚楚的讲讲边框的详细设置，之后拓展一些有趣的应用。
属性设置
border-width
border 的宽度设置上下左右时是按照顺时针方向来的，方便记忆（自从按照顺时针来记忆，所有的相关的 margin、 padding 等等的宽度设置我都记住了，作为新手的一个小 tip ）。
/* border-width: width */
border-width: 5px;
/* vertical | horizontal */
border-width: 2px 1.5em;
/* top | horizontal | bottom */
border-width: 1px 2em 1.5cm;
/* top | right | bottom | left */
border-width: 1px 2em 0 4rem;
border-width: inherit;
border-style
这个属性的设置是用来设置边框的样式，例如常用的 solid（实线）、 dashed（虚线）等等。
/* 边框的样式将为虚线状 */
border-style: dashed;
border-color
/* 边框的颜色将变为黑色 */
border-color: #000;
设置边框的颜色（大家都知道，废话什么……），不过在网上学到了一个使用的小技巧与设置边框的颜色有关，待会在下面说明。
border-radius
应用
总结
接下来让我强行总结一番。
