ホームページ >ウェブフロントエンド >htmlチュートリアル >div1_html/css_WEB-ITnoseの途中にdiv2を置く方法
div1_html/css_WEB-ITnoseの途中にdiv2を置く方法
- WBOYオリジナル
- 2016-06-24 12:24:461217ブラウズ
div1 の水平方向の中央に div2 を作成する方法
ディスカッション (解決策) への返信
js を使用して 2 つの幅と高さを動的に計算し、2 で割って div1 のパディングを設定できます
<style>div{margin:0;padding:0}#div1{position:relative;height:200px;width:200px;background-color:red}#div2{position:absolute;height:100px;width:100px;background-color:yellow;top:50%;margin-top:-50px;left:50%;margin-left:-50px}</style><div id="div1"> <div id="div2"> </div></div>
<style>div{margin:0;padding:0}#div1{position:relative;height:200px;width:200px;background-color:red}#div2{position:absolute;height:100px;width:100px;background-color:yellow;top:50%;margin-top:-50px;left:50%;margin-left:-50px}</style><div id="div1"> <div id="div2"> </div></div> 私の div1 ブラウザのスパンで幅が拡張します
拡張するだけで、div1 の width 属性を削除するだけで大丈夫です
div2 の幅が固定されている限り。
<style>div{margin:0;padding:0}#div1{position:relative;height:200px;width:200px;background-color:red}#div2{position:absolute;height:100px;width:100px;background-color:yellow;top:50%;margin-top:-50px;left:50%;margin-left:-50px}</style><div id="div1"> <div id="div2"> </div></div> 私の div1 の幅はブラウザのスパンに合わせて拡張されます
1111
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。