根据父宽度定位绝对顶部属性

有以下 HTML

<div class="child-of-body">
    This is a text
</div>

和以下 CSS

.child-of-body {
    position: absolute;
    top: 10%;
}

我可以设置top所选元素的值。 我看到10%是根据父母身高计算的。

我怎样才能设置top基于父宽度的百分比值属性？

我知道这可以通过 JavaScript 实现，但是仅使用 CSS 就可以吗？

JSFIDDLE

我想你正在寻找margin-top财产。

顶部/底部的百分比值padding or margins是相对于width包含块的。

.child-of-body {
    position: absolute;
    margin-top: 10%;
}

JSFiddle 演示.

另外，值得一看路易斯·拉扎里斯CSS 中的垂直百分比文章。