利用CSS盒子模型制作花样边框

1.盒子模型的基本属性：

border(边框)  

border-style（边框的线型）

  padding（边框内壁与内部元素之间的距离）

  padding:1px 2px 3px 4px;（顺序是上右下左）

  padding:1px 2px;（上下/左右）

  padding:1px 2px 3px;（上1px下3px左右2px）

  padding-top

  padding-bottom

  padding-left

  padding-right

  margin（代表边框外壁与其它元素之间的距离）

  margin:1px 2px 3px 4px;（顺序是上右下左）

  margin:1px 2px;（上下/左右）

  margin:1px 2px 3px;（上1px下3px左右2px）

  margin-top

  margin-bottom

  margin-left

  margin-right
2.案例：