【先端テクニック】borderを利用して三角形や台形を描く

borderは要素の内容と内側の余白を囲む1つ以上の線です.borderプロパティでは、要素の枠線のスタイル、幅、色を指定できます.

 ：
border-width      none/hidden/solid/dashed/dotted
border-color                 
border-style        
      ：border:width color style

   ：    
          ，  。             。

まとめ:
1.1つのエッジborderに色を設定し、隣の2つのエッジborderの色を透明に設定し、エッジborderを設定しないで、三角形が設定されていないエッジの方向を指す(6,7の場合など)
2.1つのエッジborderを設定するには色があり、隣の1つのエッジborderを設定するには色が透明で、他の2つのエッジborderを設定しない(8の場合、図7の場合以上に上を削除した)