css – 使用“em”而不是“pt”字体大小单位有什么实际的理由吗?

前端之家收集整理的这篇文章主要介绍了css – 使用“em”而不是“pt”字体大小单位有什么实际的理由吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我学到的一个CSS规则是你应该使用相对的“em”font-size单位,而不是绝对的“pt”。一般的想法是将您身体标签中的字体大小设置为例如。 “94%”,然后使用这样的“em”大小设置所有其他元素。推理是:

>然后,您可以通过一次修改正文的字体大小来更改网站上所有字体大小的相对大小
>用户自己可以修改字体的大小,因为它们被定义在“em”

然而,当使用“em”而不是“pt”时,我经常遇到以下问题,其中具有font-size的元素被嵌入另一个具有字体大小的元素中,因此变得很小(在下面的一个词汇单词的情况下.8的.8,另一个是.8的1.2)。

<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”样式字体的大小。

所以这里是我的问题:

有没有任何现实世界的原因,为什么我应该使用“em”而不是“pt”?
>使用“em”大小有没有技巧,以至于我不会遇到上面嵌入的字体大小的问题?

解决方法

根据你所居住的国家,你可能会用pt而不是em来破坏法律,这取决于你的立法机构要执行规则的程度。在英国,有一种残疾歧视行为,已被用来瞄准那些以固定字体呈现网站的公司。这被视为歧视,因为它不利于部分位置的人可能会增加浏览器字体大小以进行补偿 – 但是您的网站仍会以您设置的大小呈现字体,而不是按照他们期望的大小。

是的,很难掌握相对的字体大小和流畅的布局,但是如果要遵守立法,您必须花时间来掌握这一点。

对于在英国的地方政府工作,已经设定了目标,以确保网站遵循Double A指南,其中之一指出“在标记语言属性值和样式表属性值中使用相对而不是绝对单位”。见here

猜你在找的CSS相关文章