線の色 (詳細情報) | |
---|---|
字体 |
border-color:★; 線の色をまとめて指定。 border-top-color:★; 線の色を上だけ指定。 border-left-color:★; 線の色を左だけ指定。 border-right-color:★; 線の色を右だけ指定。 border-bottom-color:★; 線の色を下だけ指定。 |
指定 |
★の部分に下記の「 」内 の効果を指定していきます。
|
効果 | 枠線の色を指定することができます。 |
例1 | <div style="border-style: solid; border-color: red;">ホームページの素材屋です</div> |
結果 | ホームページの素材屋です |
例2 | <div style="border-style: double; border-color: #0000aa;">ホームページの素材屋です</div> |
結果 | ホームページの素材屋です |
例3 | <div style="border-style: groove; border-color: #d70;">ホームページの素材屋です</div> |
結果 | ホームページの素材屋です |
例4 | <div style="border-style: double; border-width: 6px; border-top-color: #d2f;">ホームページの素材屋です</div> |
結果 | ホームページの素材屋です |
例5 | <div style="border-style: solid; border-width: 10px; border-color: #fa0 #08d #080 #d6f; padding: 8px;">ホームページの素材屋です</div> |
結果 | ホームページの素材屋です |