サイト内検索
...スタイルシート(css)...
スタイルシート・画像
画像の周囲の余白
- 画像の周囲の余白を指定するには、marginプロパティを指定します。
- img要素に設定すると、画像の周囲に余白をつけることができます。
- [使い方]
- .sample{float: left; margin: 30px;}
| プロパティ名 | 値 | 説明 |
|---|---|---|
| margin: | ; | 「数値+単位」（例・・100px）を指定します。
単位は、「px」・「em」など、または「%」を指定します。 |
| auto; | 自動を設定することもできます。 |
| プロパティ名 | 値
（サンプル） |
説明 |
|---|---|---|
| margin: | 10px; | 上下左右 の指定をします。 |
| margin: | 10px 20px; | 上下・左右 の指定をします。 |
| margin: | 10px 20px 30px; | 上・ 左右・下 の指定をします。 |
| margin: | 10px 20px 30px 40px; | 上・右 ・下・左 の指定をします。 |
サンプル
[ｈｅａｄの中]
<style type="text/css"><!--
.sample{float: left; margin: 30px;}
-->
</style>
[ｂｏｄｙの中]
<img src="img/sample.JPG" width="110" height="70" class="sample">
margin:30px;
を指定して上下左右に
文字を
表示しています。
[ブラウザ上]
|
margin:30px; を指定して上下左右に 文字を 表示しています。 |
