Question

是否有任何方法可以创建增加字体大小的css标签？类似的东西：

<style>
p {
    font-size: 100%;
}

lrg {
    font-size: +40%;
}
</style>

<p>Hi <lrg>Tom</lrg>!</p>

在上面的示例中，默认文本大小为100％，但标记内的文本大小为140％（100 + 40）。

有没有办法得到类似的结果??

Answer 1

您可以使用em单位：

＆＃13;

span {
    font-size: 1.4em; /* 40% bigger than the parent */
}

＆＃13;

<p>Hi <span>Tom</span>!</p>

＆＃13;

Answer 2

正确的做法如下：

<style>
p {
    font-size: 100%; /* This is actually redundant as it does not change the font size */
}

.lrg {
    font-size: 140%; /* 40% increase */
}
</style>

然后像这样使用它：

<p>Hi <span class="lrg>Tom</span>!</p>

以这种方式思考：百分比乘以并设置高于100%的值会增加先前设置的字体大小，而设置低于100%的值会减少先前设置的值字体大小。

使用em单位也是如此。使用1.0em以上的数字增加1.0em以下的数字以减少字体大小。

Answer 3

除了其他答案外，请考虑使用font-size: larger。但是，您无法随机发明自己的新HTML标记。这就是类的用途：

/* Define a CSS class that makes the font larger */
.lrg { font-size: larger; }

<!-- Use a span tag with the new class -->
<p>Hi <span class="lrg">Tom</span>!</p>

CSS标签增加字体大小

3 个答案: