ブロック要素のスタイル
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
width: 200px | 50%; (パーセントは親要素に対する比率) height: 200px | 50%; border-color: red; border-width: 1px; border-style: solid | dashed | dotted | double | inset | outset; //borderの内側がpadding padding: 10px; //数値1個 → (上下左右) padding: 10px 10px; //数値2個 → (上下) (左右) padding: 10px 10px 10px; //数値3個 → (上) (左右) (下) padding: 10px 10px 10px 10px; //数値4個 → (上) (右) (下) (左) padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; //borderの外側がmargin margin: 10px; //数値1個 → (上下左右) margin: 10px 10px; //数値2個 → (上下) (左右) margin: 10px 10px 10px; //数値3個 → (上) (左右) (下) margin: 10px 10px 10px 10px; //数値4個 → (上) (右) (下) (左) margin-top: 10px; margin-bottom: 10px; margin-left: 10px; margin-right: 10px; |
参考サイト
スタイルシートリファレンス（目的別）
http://www.htmq.com/style/index.shtml