Question

@font-face {
font-family: 'Snell Roundhand Script';
src: url('../fonts/snell-roundhand-script.eot');
src: url('../fonts/snell-roundhand-script.eot?#iefix') format('embedded-opentype'), url('../fonts/snell-roundhand-script.woff') format('woff'), url('../fonts/snell-roundhand-script.ttf') format('truetype'), url('../fonts/snell-roundhand-script.svg#Snell Roundhand Script') format('svg');
}
@font-face {
font-family: 'Baskerville Old Face';
src: url('../fonts/ufonts.com_baskerville-old-face.eot');
src: url('../fonts/ufonts.com_baskerville-old-face.eot?#iefix') format('embedded-opentype'), url('../fonts/ufonts.com_baskerville-old-face.woff') format('woff'), url('../fonts/ufonts.com_baskerville-old-face.ttf') format('truetype'), url('../fonts/ufonts.com_baskerville-old-face.svg#Baskerville Old Face') format('svg');
}

上面的代码是字体代码

下面我正在灌输我添加的CSS：

.big-red-text{
color: #ff0000;
font-family: Snell Roundhand Script;
font-size: 50px;
text-align: center;
}

.big-orange-text{
color: #ff6600;
text-align: center;
font-weight: 600;
font-family: Baskerville Old Face;

}

这有什么遗漏吗？为了不考虑字体？所有字体都存储在根目录的字体文件夹中。

Answer 1

如果您的字体名称包含空格，则必须用单引号将其括起来。如果名称中没有空格，您可能会丢失单引号，但我建议始终使用它们来避免错误。

因此，Fundhor建议它可以与

一起使用

font-family: 'Snell Roundhand Script';

和

font-family: 'Baskerville Old Face';

确保您的文件位于正确的位置：

- css
-- fonts.css <-- here you are declaring your @font-face
- fonts
-- snell-roundhand-script.eot
-- etc...

在使用fonts.css

之前，请先添加font-family

Answer 2

试试这个：

.big-red-text{
    color: #ff0000;
    font-family: 'Snell Roundhand Script';
    font-size: 50px;
    text-align: center;
}

Answer 3

您是否购买了字体或字体系列？

网址：https://www.fonts.com/font/linotype/snell-roundhand

fonts.com 的支持团队应该能够解决您的问题。

为什么我的字体没有变化？

3 个答案: