1.11 border 边框

• 简写四周边框
• 单独属性四周边框
• 单独属性区分设置
• 单边框

简写四周边框

<p style="border: 20px solid greenyellow;"> border </p>

单独属性四周边框

<p style="border-width: 20px;border-style: dashed;border-color: blue;"> border </p>

<!--
border-width    边框宽度，默认 medium、thin、thick、length、inherit
border-style    边框类型，默认 none、hidden、dotted、dashed、solid、double、groove、ridge、inset、outset、inherit
border-color    边框颜色，默认 transparent、color、inherit
-->

单独属性区分设置

<p style="border-width: 10px 20px;border-style: solid double dashed;border-color: blue red green yellow;"> border </p>


<!--
1 个属性值  四周统一
2 个属性值  上下 左右
3 个属性值  上 左右 下
4 个属性值  上 右 下 左
-->

单边框

• 类似四周边框；

<p style="border-top: 20px solid red"> border </p>
<p style="border-top-width: 20px;border-top-style: solid;border-top-color: red;> border </p>