ホームページ  >  記事  >  ウェブフロントエンド  >  margin の auto 属性値が無効な理由_html/css_WEB-ITnose

margin の auto 属性値が無効な理由_html/css_WEB-ITnose

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

margin の auto 属性が無効な理由:
推奨: 可能な限りコードを手書きすることで、学習の効率と深さを効果的に向上させることができます。
通常、margin:0px auto を使用して、オブジェクトが水平方向の中央に配置されるように設定できます。これは、auto 属性値によりブラウザがオブジェクトのマージン サイズを自動的に決定できるためですが、次の状況では失敗します。コードは次のとおりです。

<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">.parent{  width:300px;  height:200px;  border:1px solid red;}.children{  width:200px;  height:100px;  background-color:green;  position:absolute;  margin:0px auto;}</style></head><body><div class="parent">  <div class="children"></div></div></body></html>

サブオブジェクトは絶対位置にあるため、margin:0px auto では中央揃えできません。解決策については、div で水平、垂直、中央の効果を実現する方法を参照してください。

元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=4707

詳細については、以下を参照してください: http://www.softwhy.com/divcss/

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