ホームページ >ウェブフロントエンド >htmlチュートリアル >2 つのレイヤーを同じレベルになるように調整する方法_html/css_WEB-ITnose
2 つのレイヤーを同じレベルになるように調整する方法_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 12:20:291917ブラウズ
CSS レイヤー
同じ水平線上に 2 つのレイヤーを設定する方法
float 属性を調整するためですか
お願いします
ディスカッションへの返信（解決策）
明確にしてください
絶対配置の場合レイヤー、同じレベルにレンダリングします コンテナの上部が同じ場合、平らになります
margin-top、これを使用しますか?
2 つの div が同じ水平線上にある場合は、float 属性を left に設定します。2 つの div を合わせた幅が上のコンテナの幅を超える場合は、最初の div の幅に注意してください。 2 つの div は下のレイヤーに分類されます。
2 つの div が重なっている場合は、位置を絶対に設定してから、z-index 属性を設定して、どちらの div が上のレイヤーにあるのか、どちらが下のレイヤーにあるのかを決定できます。
上の同じ水平線?
下端は同じ水平線ですか？
float:left right
div が 2 つある場合、同じ水平線に対して、float 属性を left に設定するだけです。2 つの div を合わせた幅が上のレイヤーを超えている場合に注意してください。コンテナの幅が増加すると、2 番目の div が下のレイヤーに落ちます
2 つの div が重なっている場合は、位置を絶対に設定し、z-index 属性を設定してどの div が上のレイヤーにあるのかを決定できます。 1 つはグラウンドフロアにあります。
同じ水平線を作る 2 つの方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head></head><body><div style="width:100px; float:left; display:inline; height:200px; background-color:#ccc;">左边</div><div style="width:100px; float:left; display:inline; height:200px; background-color:#999933;">右边</div></body></html>
<div id="leftcolumn" style="float:left;width:100px;height:100px"></div><div id="rightcolumn" style="margin-left:110px;height:100px"></div>
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。