表示と配置
Updated
適用対象となる要素とその内容の表示方法や配置方法の指定に関するプロパティ。
- bottom
- bottomプロパティは positionプロパティで位置指定されている要素のボックスの下辺を包含ブロックからどれだけ離すのかを指定します。同じ位置を指定するプロパティは他にも、上辺からの位置を指定する topプロパティ、左辺からの位置を指定する leftプロパティ、右辺からの位置を指定する rightプロパティがあります。
- clear
- clearプロパティは floatプロパティで指定された要素の回り込み（浮動化）の効果を解除します。clearプロパティは br要素の clear属性と同様の働きをすることと、CSS1 ではすべての要素が適用対象であったこともあって、br要素に指定されていることが多く、どの UA においてもそれで回り込みの解除が反映されるのですが、正確には CSS2 の仕様より適用対象がブロックボックスを形成する要素のみに変更されています。
- clip
- clipプロパティは絶対位置決めの要素の表示領域の中で、特定の領域だけを切り抜いて表示することができます。CSS2.1 で切り抜ける形状は矩形（rect）のみで、top, right, bottom, left の時計回りの順にその領域を指定します。
- direction
- directionプロパティは当該要素の内容となっているテキストの基本書字方向の指定と、unicode-bidiプロパティで指定された Unicode の双方向アルゴリズムの組み込みと上書き方向を指定します。
- display
- displayプロパティは要素が生成するボックスの表示形式や振る舞いを指定します。通常、要素はそれぞれブロックボックスを生成するブロックレベル要素かインラインボックスを生成するインライン要素の2種類に大別されますが、displayプロパティで別の種類のボックス生成させたり、別の振る舞いを割り当てることができます。
- float
- floatプロパティは要素のボックスを左、または右に寄せて、その反対側に後続の内容を流し込ませるフロート（浮動化）を指定します。フロートは、回り込みとも言い換えられます。
- left
- leftプロパティは positionプロパティで位置指定されている要素のボックスの左辺を包含ブロックからどれだけ離すのかを指定します。同じ位置を指定するプロパティは他にも、上辺からの位置を指定する topプロパティ、下辺からの位置を指定する bottomプロパティ、右辺からの位置を指定する rightプロパティがあります。
- overflow
- overflowプロパティはブロックボックスを形成する要素の内容が指定された横幅・高さの領域からはみ出した場合の表示方法を指定します。widthプロパティ、heightプロパティにより内容領域を指定されたブロックボックスを形成する要素が、指定されたサイズよりも内容が大きなサイズをもつ場合などが対象となります。
- position
- positionプロパティは要素の配置方式を指定し、top, bottom, left, right の各プロパティによって配置する位置を指定します。非視覚環境での観覧者に配慮したメニューを読み飛ばすリンクなど、positionプロパティはアクセシビリティを高めるためのテクニックにも応用されています。
- right
- rightプロパティは positionプロパティで位置指定されている要素のボックスの右辺を包含ブロックからどれだけ離すのかを指定します。leftプロパティと rightプロパティの両方に長さ、またはパーセンテージ値を指定した場合、leftプロパティの値が優先され、rightプロパティの値は無効となります。
- top
- topプロパティは positionプロパティで位置指定されている要素のボックスの上辺を包含ブロックからどれだけ離すのかを指定します。適用対象は、positionプロパティで relative, absolute, fixed のいずれかが指定された位置指定されている要素です。
- unicode-bidi
- unicode-bidiプロパティは言語ごとに決まっている文字の書字方向を組み込んだり、上書き変更することができます。Unicode の双方向アルゴリズムが上手く働かなかった場合、逆に双方向アルゴリズムの働きによって不正確なプレゼンテーションが行われる場合に双方向アルゴリズムを制御するために用います。
- visibility
- visibilityプロパティは要素が生成するボックスの表示・非表示を指定します。ただし、要素を非表示に指定しても、その要素が生成するボックス分のスペースは残り、レイアウトにも影響します。:hover擬似クラスや JavaScript と組み合わせて動的な表現を演出する際に利用されます。
- z-index
- z-indexプロパティは positionプロパティで位置指定されている要素の重ね合わせの順序を指定します。指定された整数値が大きいほど上に重ねられ、要素は手前に表示されます。