2004.11.11

Over flowを用いた擬似フレームをCSSにまとめる

■用途
overflow属性とは、ボックス内に要素が収まりきらなかったい場合に、
収まりきらない部分をどのように扱うかを指定するプロパティです。

■サンプルソース
--------------------------------------------------------------------------
<html>
<head>
<title> CSSでOverflowを用いた擬似フレームを作成する</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<style type="text/css">
<!--
.of { width: 100%; height: 50px; overflow: auto }
-->
</style>
</head>
<body>
<div class="of">
CSSでOverflowを用いた擬似フレームを作成する<br>
CSSでOverflowを用いた擬似フレームを作成する<br>
CSSでOverflowを用いた擬似フレームを作成する<br>
CSSでOverflowを用いた擬似フレームを作成する<br>
CSSでOverflowを用いた擬似フレームを作成する<br>
</div>
</body>
</html>
--------------------------------------------------------------------------

■表示例
擬似フレーム

■プロパティ値
visible:表示する
hidden:表示しない
auto:ブラウザ依存
scroll:スクロール

※通常、autoを指定するとボックスに収まりきらなかった場合にのみ
スクロールバーが出現するのに対し、scrollを指定すると常にスクロールバーが出現します。

トラックバック

この一覧は、次のエントリーを参照しています: Over flowを用いた擬似フレームをCSSにまとめる:

» 【CSS編】最終回 入力系と明細 送信元 システム事業部
Webシステムで売上情報や日次報告などを入力する場合、やプルダウンメニューを用い... [詳しくはこちら]

» 印刷を考慮したページ作り 送信元 グラフィックデザイン部
Webページの中の一部分の文章の表示方法を、ブラウザで見た場合と印刷して紙に出力... [詳しくはこちら]

» SEO フレームと別ウィンドウ 送信元 IT日記
うちの会社はECサイトをやっているのですが、年明けぐらいから新規獲得がずっと好調です。いくつか要因はあるのですが、その1つにSEOの成功があります。 S... [詳しくはこちら]

photo
admin