Html 当字体都在em中设置时，如何设置div的大小？

我想创建一个只使用“em”字体大小的页面

页面将有一个网格（平铺），每个单元格都有一个图像，图像上下都有一些文本。这些图像的大小都是200px 200px。网格单元将比图像稍大一些，以容纳文本区域

---

考虑到我希望字体大小仅依赖于“em”而不是“px”，我应该如何设置Div和Img标记的高度和宽度。

em

是一个相对的度量单位，它从父元素的字体大小继承其值，因此，要使用

em

将一致的宽度应用于

img

元素，您需要使用

px

中的度量值在文档结构的某处定义字体大小，并从中继承

为了便于参考，当

1em

等于

16px

时，宽度为

200px

的图像应为

12.5em

宽-

200/16

---

在任何情况下，您都需要在

px

中至少指定一次自己的测量值，以确保跨浏览器兼容性。并非每个浏览器都使用相同的默认字体大小，用户可能手动更改了浏览器的默认字体大小。如果依赖默认设置，很可能无法获得一致的结果，这将对网格设计有害。

不确定这是您想要的还是这个问题还有更多@grmmph我不想在“em”中设置img大小，因为它会扭曲图像。如果只设置宽度属性，则不会。它的工作原理与您将其与

px

一起使用一样，但与文档默认字体大小有关。我正在查看一些大公司的网站（如walmart.com），它们都使用“px”表示字体大小，也使用div、img标记。你知道有什么好的网站使用“em”吗？我发现只有博客谈论“em”。我想知道为什么你需要用

em

s来设计那些不是字体的东西。我宁愿使用基于百分比的网格系统来表示

div

s和

img

s。谢谢，但这似乎与“em”的含义相反。据我所知，“em”度量对于让浏览器以用户可以接受的大小显示文本非常有用。一些易访问性受到挑战的人会将默认的计算机字体设置为非常大。这是真的，并且提出了一个有趣的设计挑战。如果您仍然热衷于单独使用

em

调整大小，那么您可能希望查看CSS媒体查询，以补充您的

em

网格-它们应该可以帮助您针对更广泛的显示选项。