divはbrowser_html/css_WEB-ITnoseの中央に表示されます

WBOY
リリース: 2016-06-24 12:15:49
オリジナル
1115 人が閲覧しました

親愛なるエビさん、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階はすごいです

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート