left
解説
ボックスを配置する場合、左からの配置位置を指定します。ただしpositionプロパティの値がstatic
以外のときに有効となります。
プロパティ情報
値: | auto 、長さ、パーセンテージのいずれか。 |
---|---|
初期値: | 0 |
適用対象: | positionがstatic 以外の要素 |
継承: | しない |
パーセンテージ: | コンテナブロックの幅に対する割合 |
適用メディア: | 視覚 |
レベル: | 1〜2 |
参照
top bottom left right overflow overflow-x overflow-y position display float clear z-index visibility clip direction unicode-bidi writing-mode
使用例
ソース
CSSの記述方法はスタイルシートってなに?も参照下さい。 div.sample {height: 50px; background-color: #ffcccc; position: relative; } span.sample1 {color: #0000ff; position: static; left: 8px } span.sample2 {color: #0000ff; position: relative; left: 8px } span.sample3 {color: #0000ff; position: absolute; left: 8px } span.sample4 {color: #0000ff; position: fixed; left: 8px }
HTMLの記述方法 <div class="sample">position: static<span class="sample1">Static</span></div> <div class="sample">position: relative<span class="sample2">Relative</span></div> <div class="sample">position: absolute<span class="sample3">Absolute</span></div> <div class="sample">position: fixed<span class="sample4">Fixed</span></div>
表示結果
position: staticStatic
position: relativeRelative
position: absoluteAbsolute
position: fixedFixed