【CSS】overflow-y - 領域から出たコンテンツの振る舞い(上下)

【CSS】overflow-y - 領域から出たコンテンツの振る舞い(上下)

CSSのoverflow-yプロパティについて解説します。

検証環境

overflow-y

overflow-yは“領域から出たコンテンツの振る舞い(上下)”のプロパティです。

基本構文

overflow-y: 値;

代表的な値は次の通りです。

意味
auto ユーザーエージェント(ブラウザ)の仕様
visible 表示
hidden 非表示
scroll スクロール

サンプル

<style>
p {
    height: 50px;
    border: 1px solid black;
    padding: 15px;
    ___ih_hl_start
    overflow-y: scroll;
    ___ih_hl_end
}
</style>

<p>
    CSS : Cascading Style Sheets.<br>
    CSS is a programming language<br>
    that decorates elements such as HTML and XML.<br>
    You can set various properties<br>
    such as text color, background, and size.<br>
</p>