0

w3c仕様の状態

% 含んでいる要素の幅のパーセントで余白を指定します

これが縦余白にも当てはまるのではないかと思っていました。最初はそうではないと思っていましたが、絶対位置を使用するコンテナ div と静的位置を使用する包含 div がありました。含まれている div の垂直マージンは、含まれている div の位置も絶対に変更しない限り、コンテナ div ではなくhtml の幅とまったく同じです。したがって、余白がドキュメント レイアウトの影響を受けているのか、それを含む要素の幅のみを使用するのか疑問に思っていました。

アップデート：

div2 の位置を変更すると、サイズが変更されます。

CSS:

body {
  height:100%;
}

div {
}

#div1
{
  height: 50%;
  background: #333;
  padding:1px;
}

#div2
{
background-color:#000;
height:50%;
//position:static;
position:absolute;
margin:25%;
}

HTML: <div id="div1"><div id ="div2">this</div> </div>

4

4 に答える 4

2

CSS では、margins のパーセンテージ値 (垂直マージンと水平マージンの両方、およびpaddingパーセンテージ値) は常に、要素を含むボックスのwidthに対して相対的に計算されます。参考までに、CSS2.1仕様の次の段落を参照してください: little link。

それが役に立ったことを願っています！

于 2012-08-26T19:30:21.123 に答える
0

はい。最初は奇妙に思えるかもしれませんが、2つの賢明な理由があります。

  1. 水平方向のマージンと垂直方向のマージンに同じパーセンテージを指定した場合に、必要になる可能性が非常に高くなります。
  2. コンテンツが要素内を流れていて、コンテナがそれとともに拡張している場合、垂直方向のマージンを垂直方向のサイズに依存させると、垂直方向のマージンのサイズに依存する何かに依存するようになります。
于 2012-08-26T19:42:01.607 に答える
0

CSS 2.1の仕様では、margin「パーセンテージ：含まれているブロックの幅を参照」（要素ではなくブロック）について説明しています。包含ブロックの定義には特別な規則がありますが、絶対配置されたコンテナーは、静的に配置された子の包含ブロックを（そのエッジによって）定義します。私のテストはこれに準拠しています。テストで別のことが示唆された場合は、サンプルコードを投稿してください。

于 2012-08-26T19:44:31.853 に答える
0

はい、直観に反するように見えるかもしれませんが、垂直方向のパーセンテージ マージンは、高さではなく、含まれている要素の幅に相対的です。

于 2012-08-26T19:29:48.877 に答える