相对填充是相对于什么？

Question

如果我<h1>使用padding: 1.2emor设置元素样式padding: 10%,则相对于:

1. <h1>元素的字体大小？
2. <h1>元素的高度？
3. 填充父元素？
4. 别的什么？

而且它是针对不同的em和%？

Answer 1

这是确实是不同的em和%:

埃姆斯

填充大小相对于该元素的计算字体大小.

因此,如果你<h1>的计算字体大小是16px,那么1.2 ems的填充= 1.2×16像素= 19.2像素.

百分比

填充大小相对于该元素的内容区域的宽度(即内部宽度,不包括元素的填充,边框和边距).

因此,如果您<h1>的宽度为500px,则10%填充= 0.1×500像素= 50像素.

(请注意,顶部和底部填充也将是元素宽度的10%,而不是元素高度的10%.)