Mengenal Fungsi Font-face pada CSS

Cinta yaitu perbuatan. Kata-kata dan tulisan indah yaitu omong kosong. Halo teman-teman, apa kabar? Terbaik dan nomor satu nya ya pasti. Oke di kesempatan kali ini saya akan membahas mengenai Mengenal Manfaat Font-face di CSS.

Font yang kita inginkan telah kita unduh atau unduh dari website-website penyedia font, kemudian ingin kita gunakan di situs/blog kita sendiri namun tak berhasil walaupun telah di install ke pada PC atau Laptop kita?

Ya, itu lah yang saya alami pada kurun beberapa waktu lalu. Apakah teman-teman pernah mengalami kejadian yang serupa seperti saya ini? Oke mari kita bahas lebih pada lagi bagi Mengenal Manfaat Font-face di CSS.

Manfaat Font-face ini memproseskan file font yang berekstensikan:

– .EOT

– .TTF / .OTF

– .SVG

– .WOFF

Berikut yaitu contoh pemakaian font-face:

@font-face {
    font-family: myFirstFont;
    src: url(sansation_light.woff);
}

Penulisan Font-face didalam nya ada font-family, nah font-family tersebut menamakan font yang telah kita unduh itu, penamaan nya bebas ya teman-teman.

Nah kemudian pemakaian nya setelah kita telah mengaktifkan font yang telah kita unduh tadi, seperti berikut:

p {
    font-family: myFirstFont;
}

Kelebihan dari Font-face ini sendiri mempunyai kebebasan bagi memakai bermacam-macam macam jenis font. akan tetapi, dari kelebihannya itu pun pasti ada kekurangannya teman-teman. Yaitu, membangun loading browser menjadi lemot karena browser tersebut mesti mengunduh font-font alternatif kamu tersebut. akan tetapi tak usah khawatir dengan hal itu, karena jikalau telah melewati dari loading font tersebut, berikutnya akan seperti lazimnya karena font telah tersimpan pada cache web browser kalian.

Ada kesimpulan dari saya nih teman-teman, jangan terlalu banyak memakai jenis font-font luar yang mesti kita unduh, karena akan memperlambat loading situs kamu.

Bagaimana teman-teman? Telah paham bagi font-face nya?

Sekianlah bagi artikel kali ini mengenai Mengenal Manfaat Font-face di CSS.

Semoga bermanfaat, terima kasih

Sumber https://kursuswebsite.org