ホームページ > 記事 > ウェブフロントエンド > div の幅を超える要素を水平方向にスクロールさせる方法?_html/css_WEB-ITnose
div の幅を超える要素を水平方向にスクロールさせる方法
水平スクロール overflow-y:auto
垂直スクロール overflow-x; :auto;
もちろん、コンテナ div の幅も設定する必要があります。
オーバーフロー属性を設定してみる
#tar1, #tar2, #tar3 { width: 540px; height: 220px; } #content { width: 560px; height: 220px; overflow: auto; } <div id="content"> <div id="tar1" style="background-image: url(/1.jpg)"> </div> <div id="tar2" style="background-image: url(/2.jpg)"> </div> <div id="tar3" style="background-image: url(/3.jpg)"> </div> </div>
#tar1, #tar2, #tar3 { width: 540px; height: 220px; } #content { width: 560px; height: 220px; overflow:auto; } <div id="content"> <div id="tar1" style="background-image: url(/funny/1.jpg)"> </div> <div id="tar2" style="background-image: url(/funny/2.jpg)"> </div> <div id="tar3" style="background-image: url(/funny/3.jpg)"> </div> </div>
#content { width: 560px; height: 220px; overflow:auto; }
を
#content { width: 460px; height: 220px; overflow:auto; }