Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490
要素からはみ出したコンテンツの表示方法を指定できます。
visible
高さ:50px、幅50pxのボックスを設定した場合overflowがvisibleだとボックスからはみ出た部分はそのまま表示されます。
<p class="example">あいうえおあいうえおあいうえお</p>
.example {
width: 50px;
height: 50px;
overflow: visible;
background: skyblue;
}
横にはみ出た文字を折り返したいとき
white-spaceをnowrapにすることで改行しない。normalにすれば右端で行が折り返されることになります。
hidden
overflow:hiddenを指定すると要素のボックスからはみ出た部分は隠れて見えなくなります。
scroll
overflow:scrollを指定するとはみ出た部分をスクロールにより表示することができるようになります。
横方向にスクロール
縦方向のスクロールではなく横方向でスクロールするにはwhite-space:nowrapを指定すると可能です。
auto
ブラウザに自動で設定させることができます。