[新着] Webテンプレートを仮オープンしました
max-height は最大の高さ、min-height は最小の高さを指定するプロパティです。
iframe要素にこのスタイルを設定すると、インラインフレームの最大の高さと最小の高さを指定することができます。
iframe {
max-height: 350px;
min-height: 250px;
}
| max-height | インラインフレームの最大の高さを指定します |
|---|---|
| min-height | インラインフレームの最小の高さを指定します |
それぞれ 数値+単位（px、他）か %（割合）で指定します。
※max-height のデフォルトは none（制限なし）です。（例：max-height: none）
次の使用例では、最大の高さを 350px、最小の高さを 250px に指定しています。この場合、通常の高さは350pxですが、ブラウザの高さを350pxより狭くすると、それに合わせてインラインフレームの高さも狭くなります。更にブラウザの高さを狭くしていくと、250pxより狭くなった時点でスクロールが入ります。
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
iframe {
width: 300px;
height: 100%;
max-height: 350px;
min-height: 250px;
}
-->
</style>
</head>
<body>
<p><iframe src="example.html">サンプル</iframe></p>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
