CSSでよく使うプロパティまとめ
CSSは習得すればするほど、より凝ったデザインを書くことができる。
| プロパティ | 説明 |
|---|---|
| width | 横幅。上位のプロパティからみて%で相対的に設定するか、pxで絶対的に設定するか |
| height | 長さ。上位のプロパティからみて%で相対的に設定するか、pxで絶対的に設定するか |
| margin-right | 右側の余白設定。margin-leftと同時にauto設定することで中央寄せできる。
|
| margin-left | 左側の余白設定。margin-rightと同時にauto設定することで中央寄せできる。
|
| background-image | 背景を画像に指定する。
|
| background | 背景を色で設定する。 |
| float | レイアウトを左右に寄せることができる。これで<div>を横に並べることができる。
|
| color | 文字色を決定する。 |
| font-size | 文字サイズを決定する。 |
| border | 枠線を書く。black solid 6pxなど値を三つ設定するが、それぞれ、枠線の色、スタイル、幅 を設定している。 |
| border-radius | 枠線の角を丸める。%やpxで指定する。 |
■CSSのプロパティ使用例
使用例
#container {
width:1000px;
height:1000px;
margin-left: auto;
margin-right: auto;
background-color:rgba(245,99,71,0.7);
}
width:1000px;
height:1000px;
margin-left: auto;
margin-right: auto;
background-color:rgba(245,99,71,0.7);
}
#left_col {
width: 170px;
height:1000px;
float: left;
background-image:url(‘../image/leftcol.png’);
}
#left_col_tittle {
width: 150px;
height:100px;
margin-left: auto;
margin-right: auto;
margin-top:20px;
font-size:x-large;
}
【PR】
[adcode4]
[adcode0]