ホームページ >ウェブフロントエンド >htmlチュートリアル >各layerの下部にネストされたCSS DIV_html/css_WEB-ITnose

各layerの下部にネストされたCSS DIV_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:46:531467ブラウズ

インターネット上で多くの例を見つけましたが、それは実現不可能でした。その後、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>




声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。