[新着] Webテンプレートを仮オープンしました
margin は、マージン(外側の余白)を指定するプロパティです。
iframe要素にこのスタイルを設定すると、インラインフレームの周囲にマージンを入れることができます。
#example {
margin: 5px;
}
| margin | マージンの大きさを指定します |
|---|
マージンの大きさは、数値+単位(px、他)か %(割合)、auto(自動)で指定します。
マージンの指定方法については、ボックスカテゴリーの「マージン・パディング」の項目をご覧ください。
※以下の使用例では、floatプロパティと組み合わせて使用しています。
■上下に30ピクセル、左右に60ピクセルの余白を指定した場合
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
iframe {
width: 200px;
height: 100px;
}
#example1 { width: 100%; }
#example2 {
float: left;
margin: 30px 60px;
}
-->
</style>
</head>
<body>
<div id="example1">
<iframe src="example.html" id="example2">サンプル</iframe>
<p>
スタイルシートを使<br>
った上下左右 ...
</p>
</div>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
スタイルシートを使
った上下左右のマー
ジンです。サンプル
の文章を書いてみま
した。このように指
定するとインライン
フレームと文字の間
に、適度な余白を入
れることができます。
この例では、上下に
30ピクセルのマージ
ンを指定し左右に60
ピクセルのマージン
を指定しています。