Heim > Web-Frontend > CSS-Tutorial > So passen Sie den Schriftstil in CSS an

So passen Sie den Schriftstil in CSS an

王林
Freigeben: 2020-11-12 17:24:24
Original
3575 Leute haben es durchsucht

So passen Sie den Schriftstil in CSS an: Sie können das Schriftartattribut verwenden, um den Schriftstil anzupassen, z. B. [font-weight:normal;]. Das Attribut „font-weight“ wird verwendet, um die Textstärke festzulegen. Wenn Sie die Schriftgröße des Textes festlegen möchten, können Sie das Attribut „font-size“ verwenden. Die Eigenschaft „font shorthand“ legt alle Schriftarteigenschaften in einer Deklaration fest.

(Empfehlung für Lernvideos:

CSS-Video-TutorialSo passen Sie den Schriftstil in CSS an)

Attribut:

font-family:设置文本的字体名称。
font-style:设置文本样式。
font-variant:设置文本是否大小写。
font-weight:设置文本的粗细。
font-stretch:设置文本是否横向的拉伸变形。
font-size:设置文本字体大小。
src:设置自定义字体的相对路径或者绝对路径,注意,此属性只能在@font-face规则里使用。
Nach dem Login kopieren
Beispiel:

<style type="text/css">
    *{margin:0px;padding:0px;}
    body{background:url("images/bj.jpg"); background-size:cover;}
     
/*服务器字体引入自定义字体 -》 svg*/
    @font-face{ /*定义我们自己的字体名称*/
        font-family:WebFont;  /*字体名称*/
        src:url(&#39;font/Fontin_Sans_I_45b.otf&#39;) format("opentype");/*字体的地址 格式*/
        font-weight:normal;/*italic oblique inherit */
    }
    h1.font_my{font-family:WebFont; font-size:60px;}
</style>
Nach dem Login kopieren

Verwandte Empfehlungen:
CSS-Tutorial

Das obige ist der detaillierte Inhalt vonSo passen Sie den Schriftstil in CSS an. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage