html - CSS 中的 % 是否相互流入？

Question

我正在尝试将我的固定站点变成一个流动站点，并且我有一个关于 % 的工作原理的快速问题。

    <div class=wrap>
       <div class=box>
         <Div class=text>
       <div class=box>
    <div=class=wrap>

    .wrap{
     width: 100%;
     }

   .box{
   width: 50%
   }

   .text{
   width: 25%
   }

现在给出这段代码会发生什么？包裹适合整个屏幕。该框将填充屏幕的 50%，但文本仅填充 50% 的 25%。它不会填充整个屏幕的 25%，它只会填充其包含的 div 的百分比。那是对的吗？

Answer 1

这是因为div正在计算它的维度parent。

Div 有类.Wrap从其父级计算它的尺寸，即body这就是它占用整个身体宽度的原因。

看看盒子模型