cara mengganti font di css

Mengubah font dalam pengembangan web merupakan hal yang cukup umum dilakukan. Dalam CSS, kamu dapat dengan mudah mengganti tipe font yang digunakan pada sebuah website. Berikut ini beberapa cara yang bisa kamu lakukan untuk mengubah font di CSS.

Penggunaan Properti Font-Family

Setiap elemen teks dalam HTML dapat diberikan tampilan font yang berbeda menggunakan properti font-family dalam CSS. Berikut adalah cara penggunaannya:

p {
    font-family: "Times New Roman", Times, serif;
}

Pada kode di atas, font utama yang akan digunakan adalah “Times New Roman”. Jika font tersebut tidak tersedia, maka akan diganti dengan font “Times”, dan selanjutnya dengan font jenis “serif”.

Memilih Jenis Font

Dalam memilih jenis font, ada beberapa kategori font yang bisa kamu gunakan, seperti serif, sans-serif, monospace, cursive, fantasy, dan system-ui. Kamu cukup menuliskan salah satu jenis font tersebut dalam properti font-family.

Menggunakan Font Eksternal

Jika kamu ingin menggunakan jenis font yang tidak tersedia secara standar, kamu dapat menggunakan font eksternal. Salah satu cara untuk melakukannya adalah dengan menggunakan layanan Google Fonts. Berikut adalah caranya:

Kunjungi website Google Fonts dan pilih font yang kamu inginkan.
Kopi link yang diberikan oleh Google Fonts dan tempelkan ke dalam bagian <head> dari file HTML kamu.
Setelah itu, kamu bisa menggunakan font tersebut dengan memasukkannya ke dalam properti font-family.

Contoh penggunaan Google Fonts:

<head>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
</head>

body {
    font-family: 'Roboto', sans-serif;
}

Dengan demikian, kamu telah berhasil mengganti font di CSS. Dengan berbagai pilihan font yang tersedia, kamu dapat membuat tampilan website yang unik dan menarik. Selamat mencoba!

CARA MENGGANTI FONT DI CSS

Panduan langkah demi langkah yang mudah dipahami tentang cara mengganti font di CSS.

Penggunaan Properti Font-Family

Memilih Jenis Font

Menggunakan Font Eksternal

Kelas membuat website dengan HTML dan CSS