我学到的一个CSS规则是你应该使用相对"em"字体大小的单位而不是绝对的"pt".一般的想法是将body标签中的font-size设置为例如"94%",然后将所有其他元素设置为这样的"em"大小.理由是:
然而,当使用"em"而不是"pt"时,我经常遇到如下问题,其中具有font-size的元素被嵌入到具有font-size的另一个元素中并因此变得很小(在一个词汇单词下面的情况下是.8的.8和另一个是1.2的.8).
<html>
<head>
<style type="text/css">
body {
font-size: 94%;
}
p {
font-size: .8em;
}
li {
font-size: 1.2em;
}
.vocabulary {
font-size: .8em;
}
</style>
</head>
<body>
<p>This is an <span class="vocabulary">egregious</span> test.</p>
<ul>
<li>This is in a <span class="vocabulary">superb</span> list.</li>
</ul>
</body>
</html>
当然,在非常简单,直接的HTML网站中,这没有问题,但在现实世界中,您可能甚至没有制作导入的样式表,并且在其他控件中嵌入了控件的动态网站,所有这些都可能输出HTML在线样式,我发现有"em"单位字体大小的网站有时无法维护,控制字体大小的方法是将所有内容转换为硬"px"大小.
另外,我刚检查了四个主浏览器,每个浏览器都有热键,可以增加和减少"pt"样式字体的大小.
所以这是我的问题: