无法在 css 中使用此自定义字体

Question

我无法使用@font-face 将此自定义字体添加到我的css。我用其他字体试过这段代码，但我不能用这种字体。

@font-face{
    font-family:"Megatron";
    src:url{"fonts/Megatron.otf"};
}
h1{
    font-family: Megatron;
}

<h1>Enigma</h1>

这里是link的字体 https://blogfonts.com/megatron.font

Answer 1

此字体（以及您要使用的其他字体）必须位于项目文件夹的 fonts 文件夹中。尝试此代码后：

@font-face{
    font-family:"Megatron";
    src:url("/fonts/Megatron.otf") format("opentype");
}
h1{
    font-family: Megatron;
}

P.S。您的 link 字体不工作 :(

Answer 2

您应该尝试在@font-face 中设置您的font format。

@font-face {
    font-family:"Megatron";
    src:url{"fonts/Megatron.otf"} format("OpenType");
}

此外，检查您的字体是否已正确下载到您的网页：使用网络面板然后检查字体

Answer 3

这里是CSS的代码。如果您需要任何帮助，请告诉我。并将字体文件夹添加到您的路径中。希望有用。

@font-face {
font-family: 'Conv_Megatron';
src: url('fonts/Megatron.eot');
src: local('☺'), url('fonts/Megatron.woff') format('woff'), url('fonts/Megatron.ttf') format('truetype'), url('fonts/Megatron.svg') format('svg');
font-weight: normal;
font-style: normal;

}

.demo
{
    font-family:'Conv_Megatron',Sans-Serif;
    width:800px;
    margin:10px auto;
    text-align:left;
    border:1px solid #666;
    padding:10px;
}

<div class="demo" style="font-size:25px">
    The quick brown fox jumps over the lazy dog.
</div>

无法在 css 中使用此自定义字体

Not able to use this custom font in css

html

css

fonts

font-face