[CSS] 任意の表示領域にスクロールバーを表示する方法

自由が丘で働くWeb屋のブログ

[CSS] 任意の表示領域にスクロールバーを表示する方法

[CSS] 任意の表示領域にスクロールバーを表示する方法
CSSを用いて任意の表示アリアにスクロールバーを表示する方法。
詳細は以下から。

任意の表示領域にスクロールバーを表示する方法

DIVタグにid『hoge』を指定し、そのDIVタグ内の内容をスクロールバーでスクロールできる様な表現をしたい場合、下記の様に記述します。

<style>
<!--
#hoge {
width: 100px;
height: 50px;
overflow: scroll;
}
-->
</style>

<div id="hoge">
moge<br />moge<br />moge<br />moge<br />moge<br />
</div>

上記コードは以下の様に表示されます。

moge
moge
moge
moge
moge

横スクロールを消したい場合は下記の様な記述が行えます。

<style>
<!--
#hoge {
width: 100px;
height: 50px;
overflow-y: scroll;
overflow-x: hidden;
}
-->
</style>

<div id="hoge">
moge<br />moge<br />moge<br />moge<br />moge<br />
</div>
 
カテゴリー:Webシステム開発
タグ:
2013年10月18日 10時38分
 

関連記事

 

コメントを書く

This blog is kept spam free by WP-SpamFree.

(C) 自由が丘で働くWeb屋のブログ
Get Adobe Flash player