横浜、東京に拠点を置き、検証システム/金融・証券のシステム等の構築、開発を行い、
ホームページの作成ツール支援と多岐にわたるソリューションを提供します。
スクロールバー付を指定する。
ul要素の
heightプロパティに height: 300px; (表示リストの高さ)を指定し、
overflowプロパティに overflow: auto; (スクロールバー付き)を指定する。
cssの書き方 |
/*------------------------------------------------------- 02-02 スクロールバー付き ------------------------------------------------------- */ .list_332{ width: 300px; height: 300px; /* 表示範囲指定 */ overflow: auto; /* スクロールバー付き */ } .list_332 li{ margin: 0 0 20px 50px; height: 50px; list-style-type: none; font-size: small; line-height: 1.2; background-repeat: repeat-x; background-position: left bottom; background-image: url("../images/inc_line_horizon.gif"); } .list_332 li img{ float: left; margin: 0 7px 0 0; } |
---|---|
HTMLの使用例 |
<ul class="list_332"> <li><a href="#"><img src="../images/inc_news01.jpg" alt=""/> 文字列 ・・・ /a> </li> <li><a href="#"><img src="../images/inc_news02.jpg" alt=""/> 文字列 ・・・ </a> </li> <li><a href="#"><img src="../images/inc_news03.jpg" alt=""/> 字列 ・・・ </a> </li> <li><a href="#"><img src="../images/inc_news04jpg" alt=""/> 文字列 ・・・ </a> </li> --- 省略 --- </ul> |
横浜フェスタのご案内