HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


HTMLタグボードトップ >> 今すぐ使える!便利ツール >> スタイルシート(CSS)辞典 >> サイズ/配置/視覚 >> ボックスからはみ出した部分の表示方法を縦横個別に指定する

ボックスからはみ出した部分の表示方法を縦横個別に指定する

CSSの書き方

overflow-x:値 ;
overflow-y:値 ;

CSSの詳細情報
プロパティ名 overflow-x/overflow-y 読み方 オーバーフロー・エックス/ワイ
初期値 auto 意味 要素漏れの表示方法を指定
auto/visible/hidden/scroll
対象 ブロックレベルと置換要素
CSSレベル IE独自 対応ブラウザ Windows MAC
継承 しない IE 5.0以上 --

解説

「overflow-x」および「overflow-y」プロパティは、「width」プロパティと「height」プロパティを指定しているボックスからはみ出した部分の表示方法を縦と横、個別に指定するスタイルシートです。ただし、InternetExplorer独自のプロパティですので、他のブラウザでは認識しません。

値の意味、書き方、動作、不具合については「overflow」プロパティと同じですので、詳細はそちらをご覧ください。「overflow-x」が横方向(x軸)の指定、「overflow-y」は縦方向(y軸)を指定します。

CSS/HTMLサンプル

p { width:350px; height:50px; overflow-x:visible; overflow-y:hidden; }

段落要素からはみ出た部分の表示方法を指定 サンプル