Lompat ke konten Lompat ke sidebar Lompat ke footer

Mengatur Gaya Huruf HTML Menggunakan Tag Font

Pemformatan teks pada laman html tidak hanya menggunakan bentuk format standar (bolditalicunderline, dan lain sebagainya), melainkan juga dapat mengubah gaya penulisan huruf dengan menggunakan tag <FONT>. Tag <font> pada html terdiri dari beberapa atribut yaitu SIZE, COLOR, dan FACE yang mendukung pemformatan teks pada laman html. Pada materi ini peserta didik akan belajar bagaimana cara menggunakan Tag <FONT> untuk mengubah bentuk atau gaya penulisan teks pada laman html.


3 Contoh Atribut Program Penggunaan Tag Font HTML
Ilustrasi Tag Font HTML

Sebelum memahami lebih dalam materi tentang Mengatur Gaya Huruf HTML Menggunakan Tag Font, terlebih dahulu pelajari materi tentang: Menyematkan Aplikasi Eksternal pada HTML Menggunakan Tag Embed [klik], Membuat Daftar Deskripsi HTML Menggunakan Tag DT [klik], dan Membuat Daftar Deskripsi HTML Menggunakan Tag DL [klik].

Tag font memainkan peran penting dalam pembuatan halaman website untuk dapat membuatnya terlihat menarik untuk para pembaca. Tag font digunakan untuk melakukan perubahan warna, ukuran, dan gaya teks pada dokumen html.
satu, font size: atribut ini digunakan untuk mengatur ukuran teks dalam dokumen HTML dengan menggunakan tag font atribut size. Rentang ukuran font dalam HTML adalah antara 1 hingga 7 dengan ukuran defaultnya adalah 3.

Contoh:

<!DOCTYPE html>

<html>

 

<body>

<font size = "1">

Nasi Padang

</font>

 

<br />

 

<font size = "2">

Nasi Padang

</font>

 

<br />

 

<font size = "3">

Nasi Padang

</font>

 

<br />

 

<font size = "4">

Nasi Padang

</font>

 

<br />

 

<font size = "5">

Nasi Padang

</font>

 

<br />

 

<font size = "6">

Nasi Padang

</font>

 

<br />

 

<font size = "7">

Nasi Padang

</font>

</body>

 

</html>

Output:
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang

dua, Font Type: atribut ini digunakan untuk mengatur jenis font pada dokumen html. Namun, font yang digunakan harus terinstal terlebih dahulu pada komputer yang digunakan untuk menjalankan web browser.

Contoh:

<!DOCTYPE html>

<html>

 

<body>

<font 

face = "Times New Roman" 

size = "6">

Nasi Padang

</font>

 

<br />

 

<font 

face = "Verdana" 

size = "6">

Nasi Padang

</font>

 

<br />

 

<font 

face = "Comic sans MS" 

size =" 6">

Nasi Padang

</font>

 

<br />

 

<font 

face = "WildWest" 

size = "6">

Nasi Padang

</font>

 

<br />

 

<font 

face = "Bedrock" 

size = "6">

Nasi Padang

</font>

 

<br />

 

</body>

 

</html>

Output:
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang
Nasi Padang

tiga, Font Color: digunakan untuk mengatur warna teks menggunakan atribut warna dalam dokumen html. Warna dapat ditentukan baik dengan menggunakan penyebutan literasi warna (orange, pink, red) ataupun dengan menggunakan kode hexadesimal.

Contoh:

<!DOCTYPE html>

<html>

 

<body>

 

<font 

color = "#009900">

Nasi Padang

</font>

 

<br />

 

<font 

color = "green">

Nasi Padang

</font>

 

</body>

 

</html>

Output:
Nasi Padang
Nasi Padang

Catatan:
 tag font sudah tidak didukung lagi penggunaannya pada HTML5.

Artikel ini didedikasikan kepada: Tessa Ayu Novita, Wildan Pratama Bagaskara, Aditya Aji Pradana, Afifah Eva Nuriyah, dan Aldila Puspita Husna.

12 komentar untuk "Mengatur Gaya Huruf HTML Menggunakan Tag Font"

  1. Apa yang terjadi jika font yang saya gunakan pada tag font tidak tersedia pada browser atau komputer yang saya gunakan untuk membuka dokumen html tersebut?

    BalasHapus
    Balasan
    1. Teks yang telah diatur tersebut akan diatur kedalam tipe default yang sudah disediakan oleh browser.

      Hapus
  2. Apa yang dimaksud dengan tag font pada html?

    BalasHapus
    Balasan
    1. Tag font digunakan untuk mengubah warna, ukuran, dan gaya teks atau style. Tag font dasar digunakan untuk mengatur semua jenis teks dengan bentuk tampilan yang serupa.

      Hapus
  3. Font itu makanan yang berwarna hijau yang didalamnya diisi oleh gula merah?

    BalasHapus
  4. Bagaimana cara memformat font pada HTML5?

    BalasHapus
    Balasan
    1. Selain menggunakan atribut face pada html, cara lain yang dapat dilakukan untuk memformat teks adalah dengan menggunakan atribut style. Atribut style menentukan penggunaan gaya baris dalam sebuah elemen. Atribut digunakan dengan tag P, dengan properti css berupa font-style, font-size, dan lain sebagainya. Pada HTML5 atribut font sudah tidak lagi didukung penggunaannya, sehingga alternatif pengganti dari tag tersebut adalah menggunakan CSS.

      Hapus
  5. Apa tipe default yang digunakan pada html jika tidak dilakukan perubahan format font?

    BalasHapus
    Balasan
    1. Tergantung jenis browser yang digunakan, pada browser seperti Chrome, Opera, dan Firefox: format standar untuk font adalah Times New Roman, Font Serif: Times New Roman, Font Sans-serif: Arial, Monospace at Consolas.

      Hapus
  6. Apa yang dimaksud dengan text style?

    BalasHapus
    Balasan
    1. Text Style atau gaya teks adalah sumber daya (resource) yang menentukan atribut dari teks, termasuk juga font, ukuran, spasi baris, gaya font, perataan teks, warna teks, dan latar belakang dari teks. Text tyle juga bisa menjadi bagian dari definisi kelas (dipelajari pada bagian pemrograman berbasis object), sehingga semua item yang terdapat dalam kelas tersebut dapat memiliki atau mewarisi gaya yang sama.

      Hapus

Hubungi admin melalui Wa : +62-896-2414-6106

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.

Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.

- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -