如何从Fontastic.Me导入字体

2024-10-02 08:29:35 发布

您现在位置:Python中文网/ 问答频道 /正文

我正试图让我的字体从“Fontastic.me”工作。我做了一个自定义字体,但它没有出现

@charset "UTF-8"; tbody{ color: red; font-weight: normal; font-style: normal; } @font-face { font-family: "cylexion"; src:url("../fonts/cylexion.eot"); src:url("../fonts/cylexion.eot?#iefix") format("embedded-opentype"), url("../fonts/cylexion.woff") format("woff"), url("../fonts/cylexion.ttf") format("truetype"), url("../fonts/cylexion.svg#cylexion") format("svg"); font-weight: normal; font-style: normal; } [data-icon]:before { font-family: "cylexion" !important; content: attr(data-icon); font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "cylexion" !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-cylexion-a:before { content: "\61"; } .icon-cylexion-ah:before { content: "\42"; } .icon-cylexion-ai:before { content: "\44"; } .icon-cylexion-aw:before { content: "\45"; } .icon-cylexion-ay:before { content: "\41"; } .icon-cylexion-b:before { content: "\62"; } .icon-cylexion-c:before { content: "\63"; } .icon-cylexion-d:before { content: "\64"; } .icon-cylexion-e:before { content: "\65"; } .icon-cylexion-ear:before { content: "\49"; } .icon-cylexion-f:before { content: "\66"; } .icon-cylexion-g:before { content: "\67"; } .icon-cylexion-h:before { content: "\68"; } .icon-cylexion-i:before { content: "\69"; } .icon-cylexion-j:before { content: "\6a"; } .icon-cylexion-k:before { content: "\6b"; } .icon-cylexion-l:before { content: "\6c"; } .icon-cylexion-m:before { content: "\6d"; } .icon-cylexion-n:before { content: "\6e"; } .icon-cylexion-o:before { content: "\6f"; } .icon-cylexion-oh:before { content: "\46"; } .icon-cylexion-oo:before { content: "\47"; } .icon-cylexion-ow:before { content: "\48"; } .icon-cylexion-p:before { content: "\70"; } .icon-cylexion-q:before { content: "\71"; } .icon-cylexion-r:before { content: "\72"; } .icon-cylexion-s:before { content: "\73"; } .icon-cylexion-t:before { content: "\74"; } .icon-cylexion-u:before { content: "\75"; } .icon-cylexion-v:before { content: "\76"; } .icon-cylexion-w:before { content: "\77"; } .icon-cylexion-x:before { content: "\78"; } .icon-cylexion-y:before { content: "\79"; } .icon-cylexion-z:before { content: "\7a"; } .icon-cylexion-ee:before { content: "\43"; }
{% load static %}
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">

<h1> edd</h1>
<link href="{%  static 'css/styles.css' %}" rel="stylesheet" type="text/css">
<link href="{% static 'fonts/cylexion.ttf' %}" rel="stylesheet" type="text/css">
<link href="{% static 'fonts/cylexion.eot' %}" rel="stylesheet" type="text/css">
<link href="{% static 'fonts/cylexion.svg' %}" rel="stylesheet" type="text/css">
<link href="{% static 'fonts/cylexion.woff' %}" rel="stylesheet" type="text/css">

<head>
    <title>a
    </title>
</head>

<body>
<div class="icon">Test</div>
<h1> header

</h1>
<p >goo</p>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

我试着用<div class="cylexion">"word"</div>引用它们


Tags: texturllinkfontsstaticcontenth1css

热门问题