Diskon kelas baru hingga 25%! Masukkan kupon "lebihcepat" di kelas ini

X
Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MENGUBAH FONT DI HTML

belajar bagaimana cara mengganti font kamu di HTML agar tidak terlihat membosankan!

Mengubah font di HTML dapat menjadi langkah penting dalam pengembangan website untuk memastikan tampilan yang menarik dan sesuai keinginan. Dengan mengubah font, kamu dapat menciptakan suasana dan nuansa yang berbeda pada tampilan website-mu. Berikut ini adalah panduan sederhana tentang cara mengubah font di HTML.

Langkah 1: Menggunakan Tag CSS Inline

Salah satu cara termudah untuk mengubah font di HTML adalah dengan menggunakan tag CSS inline. Untuk menggunakan metode ini, kamu perlu menambahkan atribut style ke tag HTML yang ingin diubah fontnya. Contohnya seperti berikut:

<p style="font-family: Arial, sans-serif;">Ini adalah paragraf dengan font Arial.</p>

Tag CSS inline di atas akan mengubah font paragraf menjadi Arial. Jika browser tidak mendukung font tersebut, maka akan digantikan dengan font sans-serif.

##Langkah 2: Menggunakan Tag CSS Internal

Selain menggunakan tag CSS Inline, kamu juga bisa menggunakan tag CSS Internal. Dengan cara ini, kamu dapat mendefinisikan style untuk beberapa tag sekaligus dalam elemen <style>, yang biasanya diletakkan di dalam elemen <head>.

<head>
  <style>
    p {
      font-family: Arial, sans-serif;
    }
  </style>
</head>

<body>
  <p>Ini adalah paragraf dengan font Arial.</p>
  <p>Ini adalah paragraf lain dengan font yang sama.</p>
</body>

Langkah 3: Menggunakan Lembar Gaya Eksternal (External Style Sheet)

Jika kamu ingin menggunakan font yang sama di beberapa halaman, maka menggunakan lembar gaya eksternal atau external style sheet adalah pilihan terbaik.

Caranya adalah dengan membuat file CSS terpisah dan menghubungkannya ke dokumen HTML-mu. Sebagai contoh, kita akan membuat file CSS dengan nama styles.css:

p {
  font-family: Arial, sans-serif;
}

Kemudian hubungkan file ini ke dokumen HTML dengan tag <link>:

<head>
  <link rel="stylesheet" href="styles.css">
</head>

Sekarang, semua paragraf dalam dokumen HTML akan menggunakan font Arial.

Sekarang kamu sudah mengetahui cara mengubah font di HTML dengan tiga cara berbeda. Jangan ragu untuk bereksperimen dan menemukan metode yang paling cocok untuk kebutuhan pengembangan websitemu.

cover kelas Kelas membuat website dengan HTML dan CSS
Kelas membuat website dengan HTML dan CSS

belajar membuat website kamu dari nol. Cocok untuk pemula

Lihat Kelas

Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding