ホームページ >ウェブフロントエンド >htmlチュートリアル >divはbrowser_html/css_WEB-ITnoseの中央に表示されます
divはbrowser_html/css_WEB-ITnoseの中央に表示されます
- WBOYオリジナル
- 2016-06-24 12:15:491134ブラウズ
親愛なるエビさん、DIV をブラウザーの中央に配置するにはどうすればよいですか?余白を設定するとモニターのサイズを変えるとまた違ってきます ありがとうございます！ ！ ！
ディスカッションへの返信 (解決策)
CSS を設定します:
div{
margin-left:auto;
margin-right:auto
}
これには、Div
style="position; :absolute ;top={1}px;left={2}px;"
上記のように、Div のスタイルをこれに設定する必要がありますが、top と left は動的に計算する必要があります。
問題は、ブラウザウィンドウのサイズを動的に取得することです。したがって、解決策は次のとおりです:
<html> <head> <title>DIV居中显示</title> <script type="text/javascript"> var setDivCenter = function(divId){ var oDiv = document.getElementById(divId); oDiv.style.position = "absolute"; oDiv.style.top = (document.body.offsetHeight - 150) / 2 + "px";//这个150是div的高度 oDiv.style.left = (document.body.offsetWidth - 200) / 2 + "px";//这个200是div的宽度 }; </script> </head> <body onload="setDivCenter('dvCenter')"> <div id="dvCenter" style="width:200px;height:150px;background-color:red;"> 我在浏览器的中间 </div></body> </html> たった今書いたところ、テストに合格しました~~
ありがとうございます! ！ ！ ！ ！ ！
解決方法を見てみたい
解決方法を見てみましょう
2階はすごいです
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。