0 
 <div id='divMenuT'>
    <div class='m1'><a href="index.php">Home</a></div>
    <div class='m1'>Archive</div>
    <div class='m1'>Cinema</div>
    <div class='m1'>Hora</div>
  </div>

css 

#divMenuT{
    font-size: 14px;
}

我的显示器是 1024x768px。我测试了这个网站上的页面

如果测试尺寸为 1024x768 或更小似乎没问题，但如果测试尺寸较大（例如 1660x1050），顶部菜单上的文本会变得很小且不可读。

我尝试了百分比和视口字体大小 - 没有结果。菜单在大于 1024x768 的大屏幕上总是不可读。

那么，如何在所有显示器尺寸上保持文本可读性。

顺便说一句，如果文本在较大的显示器上变小，为什么文本在小显示器上不会变大？

你可以在这里看到我的现场测试页面

4

1 回答 1

2

尝试使用em指定字体大小

另一种设置字体大小的方法是使用 em 值。em 值的大小是动态的。定义 font-size 属性时，em 等于应用于相关元素父级的字体大小。如果你没有在页面的任何地方设置字体大小，那么它是浏览器默认的，可能是 16px。因此，默认情况下 1em = 16px，而 2em = 32px。如果你在 body 元素上设置了 20px 的字体大小，那么 1em = 20px 和 2em = 40px。请注意，值 2 本质上是当前 em 大小的乘数。

为了计算所需任何像素值的 em 等效值，您可以使用以下公式：

em = desired element pixel value / parent element font-size in pixels

链接到这个

于 2013-10-10T04:53:25.840 回答