ホームページ  >  記事  >  ウェブフロントエンド  >  マージン権が機能しないのですか? _html/css_WEB-ITnose

マージン権が機能しないのですか? _html/css_WEB-ITnose

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

margin-left は機能するが、margin-right は機能しないのはなぜですか?
93f0f5c25f18dab9d176bd4f6de5d30e
b2386ffb911b14667cb8f0f91ea547a7ページ レイアウト6e916e0f7d1e588d4f442bf645aedb2f
080b747a20f9163200dd0a7d304ba388
#nav{width: 1347px;height:80px;background-color: red;}
#search{width:800px;height :60px;背景色:青; マージン: 0 自動}
#title{幅: 600px;背景色: グレー;マージン: 0 自動;}
#left{幅: 300px;高さ: 200px;マージン左: 70px;背景-color: black;}
#right{width: 400px;height: 300px;margin-right:100px;background-color: yellow;}
9c3bca370b5104690d9ef395f2c5f8d1
783490d1b9b1498c9a17e18dc7358312
eb545d6e9e25f5c0174408f6286375adナビゲーション16b28748ea4df4d9c2150843fecfba68
4f6f5faa6e22815f61a89f7a7ad3650ftitle16b28748ea4df4d9c2150843fecfba68
243a8f3f087936dc3f96e2f0cf018c22
961dd75297247cb17f67e6948fb06668ニュース16b28748ea4df4d9c2150843fecfba68
2f2ff34e01cede92ca72f5915aa0a53f div>/gt;/lt; . 親コンテナの幅を超えない限り、子コンテナの幅が収まる場合はmargin-rightの設定は無意味です

#right{width: 400px;height: 300px;margin-right :100px; Background-color: yellow; float:right}
それが機能するかどうかを確認できます

すべてのスタイル属性が役割を果たす必要があるわけではありません

1 階が言ったことはあまり明確ではありません。つまり、親コンテナーは次のことは可能ですか?取り除くことで効果が現れるのでしょうか?詳しく説明してもらえますか?

外側の div: width:500px;

内側の div: margin-right: 50px; はうまくいくと思いますか?

比較といえば。 。 。 。分かるかな?

実際、私の div はどれも独立したものではありませんが、コンテンツの幅を設定していません。

私は CSS の初心者です。要素の絶対配置、相対配置、および浮動配置について理解していますか?投稿者は最初にこれらを学習することが推奨されます。

マージンとは、2 つのマークの間にスペースを残すことです

マークが 1 つしかなく、それが左側にある場合、margin-right は効果がありません

http://bbs.blueidea.com/thread-2803660-1- 1.html

<!doctype html><html><head><meta charset="utf-8"><title>div练习页面布局</title><style type="text/css">#nav{width: 1347px;height:80px;background-color: red;}#search{width:800px;height:60px;background-color:blue; margin: 0 auto}#title{width: 600px;background-color: gray;margin: 0 auto;}#left{width: 300px;height: 200px;margin-left:70px;background-color: black;float:left;}#right{width: 400px;height: 300px;margin-right:100px;background-color: yellow;float:right;}#main{width:900px;}</style></head><body><div id="contener"><div id="nav">导航</div><div id="search">搜索</div><div id="title">标题</div><div id="main"><div id="left">要闻</div><div id="right">新闻图片轮播</div></div></div></body></html>

適切に float を追加します


フローティングではない場合、margin-right は効果がありません

フローティングではない場合、margin-right は効果がありません

機能しません、それはスペースですdiv の上位層に含まれる十分な大きさです。機能させたい場合は、この層に float:right を追加できます。上の誰かがあなたの質問に答えました。または、絶対配置を使用して書くこともできます

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