定义：border简写属性在一个声明设置所有的边框属性。

关于边框属性的认识我么需要知道的有：

border-style，指定要显示什么样的边界border-width，指定边框的宽度border-color，设置边框颜色

border-style

关于border-style的属性值可以有：默认值 none（无边框），dotted（点线边框），dashed（虚线边框），solid（实线边框）等等。

<style>.bs{    border-style: solid;}.bs2{    border-style: dashed;}.bs3{    border-style: dotted;}.bs4{       border-style: double;}</style>​<p class="bs">1px 实线 绿色的边框</p><br><p class="bs2">2px 虚线 红色的边框</p><br><p class="bs3">3px 点线 蓝色的边框</p><br><p class="bs4">定义两个边框</p>

border-width

为边框指定宽度长度值。比如给上面的第一个段落设置宽度为5px：

.bs{    border-width:5px;}

border-color

设置边框的颜色值。比如给第二个段落添加一个绿色：

.bs2{    border-color:green;}

对于上面三者的写法，我们可以使用一个简写属性将三者结合一起：border。

语法：border:border-width border-style border-color;，同样是上面的例子，我们可以简化修改：

<style>.bs1{    border:1px solid green;}.bs2{    border:2px dashed red;}.bs3{    border:3px sdotted blue;}.bs4{    border-style:double;}</style><p class="bs1">宽度为1px的实线绿色边框</p><br><p class="bs2">宽度为2px的虚线红色边框</p><br><p class="bs3">宽度为3px的点线蓝色边框</p><br><p class="bs4">定义两个边框</p>

动手小练习

随意输入三段文字，分别给文字段落定义不同类型的边框（虚线、实线和点线）在第一题的基础上，给边框加上适当的样式（包括颜色、粗细或者是字体大小等）