如何在不继承父级的情况下获得宽度？

Question

假设，这个html和css ......

<div>
  <div>test</div>
</div>

div{width: 80%;}

测试div将获得80％的80％，即64％的宽度，因为它继承自其父div。显然，如果它像80em一样设置，那么它也将继承并获得64％。但是，不是使用em，而是在不继承父母的情况下完美地工作。

那么，是否有替代像em一样的百分比？

Answer 1

不，没有任何替代品。根据您尝试实现的目标，以下内容可能是您正在寻找的内容：

div{width:80%;}
div > div{width:100%;}

Answer 2

您正在寻找的（我猜）是vw（视口宽度）

div { 
    width: 80vw;
}

使div成为视口的80％（即浏览器窗口 - 或多或少）

fiddle