ホームページ >ウェブフロントエンド >htmlチュートリアル >各layerの下部にネストされたCSS DIV_html/css_WEB-ITnose
インターネット上で多くの例を見つけましたが、それは実現不可能でした。その後、CSDN の投稿で見つけて記録しました。
必ず
style="position:relative;"を 3 層 div に設定してください
Rendering:
CSS:
div{border:1px solid black;}#content{height:100%;}#left{width:20%;height:100%;float:left;position:relative;}#right{width:78%;height:100%;float:right;position:relative;}#bottom{width:100%;position:absolute;bottom:0;}
HTML:
<div id="content" name="content"> <div id="left" name="left"> <div id="top" name="top">图片</div> <div id="bottom" name="bottom">底部</div> </div> <div id="right" name="right">右边 <div id="top" name="top">图片</div> <div id="bottom" name="bottom">底部</div> </div></div>