html センタリング問題_html/css_WEB-ITnose-htmlチュートリアル-php.cn

ディスカッションへの返信 (解決策)

ホームページ

ウェブフロントエンド

htmlチュートリアル

html センタリング問題_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 pm 12:10 PM

ページを作成するときは、本文にレイヤー

を追加し、 #wraps{ margin:0px auto; width:960px;} を使用します

このようになりますただし、コンテンツが変更され、本文に垂直スクロールバーが表示されると、コンテンツ全体が水平に移動します

現在考えている解決策は、常に垂直スクロールバーを表示することですが、方法がわかりません。それをするために？それとも他に良い解決策はありますか？

注: ページの高さが不定であるため、垂直スクロールバーの有無も不定です。

ディスカッションへの返信 (解決策)

body,html{width:100%;height:100%;overflow-x:hidden;min-width:960px;margin:0;padding:0; }

body,html{width:100%;height:100%;overflow-x:hidden;min-width:960px;margin:0;padding:0;}

機能しません

スクロールバー距離が 10 ピクセルを超える場合、左右のマージンの自動は当然再計算され、わずかに調整されます。再計算したくないんですか？

スクロールバーを制御するには、width:960px; のパーセンテージを指定しないのが最善です

<!DOCTYPE HTML><html>	<head>		<meta charset="gb2312" />		<title></title>		<style>			#wraps{				margin:0px auto; width:960px;				border:1px solid red;				position:relative; left:0; top:0;			}		</style>	</head>	<body>		<div id="wraps">123</div>		<button id="btn">body长高了，div会移动吗？</button>		<script>			var $ = function(id){				return document.getElementById(id);			};			var $t = function(tag, cot){				cot = cot || document;				return cot.getElementsByTagName(tag);			};			var a = document.body.offsetWidth;			$('btn').onclick = function(){				$t('body')[0].style.height = '2000px';				var b = document.body.offsetWidth;				var t = a - b;				//console.log(t)				if( t ){					$('wraps').style.left = t/2+'px';				}							}		</script>			</body></html>

ログイン後にコピー

これはどういう意味ですか?

5階でブラウザのウィンドウサイズを変更したらどうなるでしょうか？最大化、復元...

HTML コード

title> しかし、changjay が言ったように、中サイズと最大化がまだあります切り替え時に少し問題があります。ありがとう！より良い解決策を期待して、私も自分で js を書くつもりです。

このウェブサイトの声明

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