overflowの読み方

HTML用語「overflow」の読み方を掲載してます。

読み⽅

オーバーフロウ。

英訳

あふれる、こぼれる。

overflowとは

overflowとはボックスの範囲内に内容が収まらない場合に、はみ出た部分の表示の仕方を指定するCSSのプロパティです。

はみ出た要素の水平方向の表示方法のみを指定する際はoverflow-xプロパティ、垂直方向の表示方法のみを指定する際はoverflow-yプロパティを使用します。

overflowプロパティの値
・visible
　内容がボックスに収まらない場合、ボックスからはみ出して表示される（初期値）
・hidden
　内容がボックスに収まらない場合、収まらない部分は非表示となる。内容が収まらない場合にも、スクロールバーなどは表示されない
・scroll
　内容がボックスに収まらない場合には、スクロールバーなどが表示される
・auto
　ボックスに収まらない内容をどう表示するかは、ユーザーエージェントに依存する。内容が収まらない場合には、スクロールバーなどが表示される
・no-display
　内容がボックスに収まらない場合、display：none; が指定されたかのようにボックス全体が削除される
・no-content
　内容がボックスに収まらない場合、visibility：hidden; が指定されたかのようにボックス全体が非表示となる
※no-display、no-contentは比較的新しく追加された仕様のため、ブラウザによってはサポートが進んでいない場合があるので注意。

正円
#style {
width: 200px; height: 50px;
overflow: scroll;
}
#styleの内容がwidth200px,height50pxを超えた場合はスクロールバーが表示される。