在css中包含多种字体的正确方法

我不是一个简单的时刻。哪种方式是在css中包含多种字体的正确方法？这里是简单的例子。在css中包含多种字体的正确方法

This？

@font-face { 
font-family: DeliciousRomanRegular; 
src: url(/Delicious-Roman-R.otf); 
} 

@font-face { 
font-family: DeliciousRomanBold; 
src: url(/Delicious-Roman-B.otf); 
}

or this？

@font-face { 
font-family: Roman; 
src: url(/Delicious-Roman-R.otf); 
font-style: normal; 
font-weight: normal; 
} 

@font-face { 
font-family: Roman; 
src: url(/Delicious-Roman-B.otf); 
font-style: normal; 
font-weight: bold; 
}

为什么？我使用第二个，因为我可以将字体家族添加到BODY，并将字体样式或字体重量添加到其他类。它的工作原理。

但我看到人们多次使用第一种方法。但在我看来，这太粗鲁了。每次你需要为一个班级添加粗体时，你必须使用“font-family：DeliciousRomanRegular，Arial，sans-serif;”。 WTF？

来源

2015-05-29 AlYu

我总是用第二个。非常类似于你描述的相同原因:) –

人们使用第一种方法，因为他们无知，不知道正确的做事方式。 – 2015-05-29 05:19:16

使用第一个的人认为第二个人的风格和体重是全球性的。可能不是每个人都需要你看到的。 –

第二个选项：您使用相同的字体名称，但对于您打算使用的每个变体，您需要指定（a）变体和（b）用作字体的替代资源。

这保证了您的实际内容的CSS，你可以做这样的事情：

p { 
    font-family: Roman; 
    font-style: regular; 
    font-weight: 400; 
} 

p em { 
    font-style: italic; 
} 

p strong { 
    font-weight: 800; 
}

，事情会正常工作。将这与“改变字体系列的荒谬概念”相对照，只是因为你想要相同的字体，而是斜体。我们不要那样做。

来源

2015-05-29 05:24:51

在css中包含多种字体的正确方法

回答

相关问题