指定幅・高さの擬似フレームを作る

灰色背景がサンプルソース


サンプルソース

HTMLソース

<div class="gijif">
限られたエリアにたくさんの情報を書きたい時に使うと便利。<br/>
更新履歴とかがよいかな？<br/><br/>
ただし長文の文章の場合、限られた狭い範囲でこのように頻繁なスクロールが発生すると、読む気がなくなってしまうことも。
読み物中心の時は、あまり使わないほうが良いかも。<br/>
どうしても使いたい場合は、縦の擬似フレームの高さ(heightの値)を多めに取ってやることが重要です。
</div>

CSSソース

.gijif {
width:500px; height:100px; overflow:scroll;
}

サンプル表示

→指定幅・高さの擬似フレームを作る(サンプル)


解説

HTMLソース

擬似フレームにしたい部分のみに適用させる為、divにclassを指定します。
ここでは、<div class="gijif">としています。


CSSソース

擬似的にフレームを作るには、overflow:scroll;というものを使います。
これは、width:500px;とheight:100px;で指定した幅・高さを超えた時に、スクロールバーを表示するというものです。