Bagaimana untuk menukar fon dalam css

CSS ialah bahasa yang digunakan untuk reka bentuk web, yang boleh membantu pembangun mencapai pelbagai kesan penggayaan. Antaranya, menukar fon adalah salah satu keperluan reka bentuk biasa. Jika anda sedang mencari cara untuk menukar fon dalam halaman web, anda telah datang ke tempat yang betul!

Pertama, untuk menukar fon, kita perlu tahu nama fon tersebut. Dalam CSS, anda boleh menentukan fon yang anda mahu gunakan menggunakan kod berikut, contohnya:

font-family: "Times New Roman", Times, serif;

Dalam kod di atas, kami telah menentukan tiga fon alternatif: Times New Roman, Times dan serif. Jika fon pertama tidak dipasang pada komputer pengguna, pelayar akan cuba memuatkan fon alternatif No. Jika fon alternatif No. 1 tidak dipasang, penyemak imbas akan cuba memuatkan fon kedua, dan seterusnya. Akhir sekali, jika semua fon alternatif tidak boleh dimuatkan, penyemak imbas akan menggunakan fon serif lalai.

Secara amnya, atribut keluarga fon memerlukan anda menyediakan senarai keutamaan, supaya anda boleh menyediakan berbilang fon:

font-family: "Helvetica Neue", Arial, sans-serif;

Dalam kod di atas, kami menyatakan tiga alternatif Font: Helvetica Neue, Arial dan sans-serif. Jika fon pertama tidak dipasang pada komputer pengguna, pelayar akan cuba memuatkan fon alternatif No. Jika fon alternatif No. 1 tidak dipasang, penyemak imbas akan cuba memuatkan fon kedua, dan seterusnya. Akhir sekali, jika semua fon alternatif tidak boleh dimuatkan, penyemak imbas akan menggunakan fon sans-serif lalai.

Selain menggunakan nama fon lalai, anda juga boleh menggunakan fon web, seperti ini:

@font-face {
  font-family: "MyWebFont";
  src: url("webfont.woff2") format("woff2"),
       url("webfont.woff") format("woff");
}

Dalam kod di atas, kami menggunakan peraturan @font-face untuk merujuk fon tersuai , Peraturan ini membolehkan anda menyimpan fail fon pada pelayan dan merujuk fon daripada fail tersebut mengikut keperluan.

Sudah tentu, sebagai tambahan kepada atribut keluarga fon, anda juga boleh menggunakan atribut lain, seperti saiz fon dan berat fon, untuk mengawal kesan paparan fon dengan lebih baik.

h1 {
  font-family: "Times New Roman", Times, serif;
  font-size: 36px;
  font-weight: bold;
}

Dalam kod di atas, kami menentukan fon tajuk sebagai salah satu daripada Times New Roman, Times dan serif, dengan saiz 36 piksel dan tebal.

Perlu diingat bahawa apabila menukar fon, pastikan hak cipta fail fon adalah sah. Sila patuhi peraturan hak cipta dan jangan gunakan fail fon orang lain sesuka hati.

Dengan kaedah di atas, anda sepatutnya boleh menukar fon dalam CSS dengan mudah untuk kesan reka bentuk web yang lebih baik.

Atas ialah kandungan terperinci Bagaimana untuk menukar fon dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!