Bagaimanakah saya boleh memberi keutamaan menggunakan fon tempatan dengan @font-face dalam CSS?

@font-face src: local - Menggunakan Fon Setempat dengan Keyakinan

Apabila memasukkan fon tersuai ke dalam kod CSS anda, anda mungkin menghadapi senario yang anda inginkan penyemak imbas untuk mengutamakan penggunaan fon yang dipasang secara setempat daripada memuat turunnya daripada sumber jauh. Isu ini timbul apabila menggunakan @font-face dan penyemak imbas mungkin berkelakuan tidak konsisten berkenaan fon yang dimuat turun.

Untuk menangani masalah ini, terdapat penyelesaian mudah yang boleh anda laksanakan dalam kod CSS anda. Dengan memasukkan 'tempatan' sebagai sumber pertama, penyemak imbas akan cuba menggunakan fon daripada sistem setempat pengguna jika ia wujud. Kod anda yang diubah suai sepatutnya menyerupai ini:

<code class="css">@font-face {
    font-family: 'DejaVu Serif';
    src: local('DejaVu Serif'), url('DejaVuSerif-webfont.eot');
    src: local('DejaVu Serif'), url('DejaVuSerif-webfont.woff') format('woff'), url('DejaVuSerif-webfont.ttf') format('truetype'), url('DejaVuSerif-webfont.svg#webfontCFu7RF0I') format('svg');
    font-weight: normal;
    font-style: normal;
}</code>

Dengan pengubahsuaian ini, penyemak imbas akan terlebih dahulu menyemak kehadiran 'DejaVu Serif' pada sistem setempat pengguna. Jika fon ditemui, ia akan digunakan tanpa perlu memuat turun. Hanya jika fon tempatan tidak tersedia, penyemak imbas akan meneruskan untuk memuat turun fail fon jauh.

Rujuk dokumentasi yang disediakan untuk butiran lanjut: https://developer.mozilla.org/en-US/docs/ Web/CSS/@font-face/src

Atas ialah kandungan terperinci Bagaimanakah saya boleh memberi keutamaan menggunakan fon tempatan dengan @font-face dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!