Mengubah Atribut Font

Belajar Menggunakan CSS untuk Mengubah Atribut Font

Font dan CSS

CSS adalah cara paling efektif untuk menyesuaikan font di halaman web Anda. Anda dapat mengontrol keluarga font , ukuran, warna, berat, dan banyak aspek lain dari tipografi.

Properti font di CSS adalah salah satu cara paling umum untuk membuat halaman Anda lebih khas dan unik. Sangat mudah untuk mengubah warna, ukuran, dan bahkan wajah (font itu sendiri) dari teks Anda dengan properti font CSS .

Ada tiga bagian untuk font:

Warna Font

Untuk mengubah warna teks, cukup gunakan properti gaya warna CSS. Anda dapat menggunakan nama warna atau kode heksadesimal. Seperti halnya semua warna di web, yang terbaik adalah menggunakan warna browser yang aman .

Coba gaya berikut di halaman web Anda:

font ini berwarna merah
font ini berwarna biru

Ukuran Font

Ketika Anda mengatur ukuran font di web Anda dapat mengaturnya dalam ukuran relatif atau sangat spesifik menggunakan piksel, sentimeter atau inci. Namun, ukuran font yang lebih tepat dimaksudkan untuk digunakan untuk mencetak dan bukan untuk halaman web, di mana setiap orang yang melihat situs web Anda mungkin memiliki resolusi yang berbeda, ukuran monitor, atau pengaturan font default. Jadi, jika Anda memilih 15px sebagai ukuran standar Anda, Anda mungkin terkejut tidak senang melihat seberapa besar atau kecil font Anda membuat bagi pelanggan Anda.

Saya sarankan Anda menggunakan ems untuk ukuran font . Ems memungkinkan halaman Anda tetap dapat diakses tidak peduli siapa yang melihatnya, dan ems dimaksudkan untuk render layar. Tinggalkan piksel dan poin Anda untuk mencetak render. Untuk mengubah ukuran font Anda, letakkan gaya berikut di halaman web Anda:

font ini adalah 1em
font ini adalah 0,75 em
font ini 1.25em

Wajah Font

Wajah font Anda adalah apa yang banyak orang pikirkan ketika mereka berpikir "font." Anda dapat mendeklarasikan font wajah yang Anda inginkan, tetapi ingat, jika pembaca Anda tidak memiliki font yang diinstal browser mereka akan mencoba untuk menemukan kecocokan. untuk itu, dan halaman mereka tidak akan terlihat seperti yang Anda inginkan.

Untuk mengatasi masalah ini Anda dapat menentukan daftar nama wajah, dipisahkan oleh koma, untuk browser yang akan digunakan sesuai urutan preferensi. Ini disebut tumpukan font. Perlu diingat bahwa font standar pada PC (seperti Arial) mungkin tidak standar pada Macintosh. Jadi Anda harus selalu melihat halaman Anda dengan mesin yang dipasang secara minimal (dan sebaiknya pada kedua platform) untuk memastikan bahwa halaman Anda tampak dirancang bahkan dengan font yang minimal.

Salah satu tumpukan font favorit saya adalah Kumpulan ini adalah koleksi font sans-serif dan sementara geneva dan arial tidak tampak sangat mirip, keduanya cukup standar pada komputer Macintosh dan Windows . Saya menyertakan helvetica dan helv untuk pelanggan di sistem operasi lain seperti Unix atau Linux yang mungkin tidak memiliki pustaka font yang kuat.

font ini adalah sans-serif
font ini bersifat serif