Cara Mengatur Warna, Ukuran dan Jenis Huruf Pada HTML

Posted by Ashari

Dalam tutorial ini saya akan membahas tentang bagaimana Cara Mengatur Warna, Ukuran dan Jenis Huruf Pada HTML. Pada pengaturan huruf ini menggunakan Tag <font> diakhiri </font>. Tag ini memiliki 3 atribut yaitu color untuk warna, size untuk ukuran dan face untuk mengatur jenis huruf yang akan digunakan. Untuk lebih jelasnya kita bahas satu persatu-satu.

1. Mengatur Warna Huruf

Untuk mengatur warna pada html yaitu dengan menggunakan tag <font color="nama_warna"> diawal tulisan yang akan diberikan warna dan diakhiri dengan tag </font>. Ada beberapa contoh warna pada html seperti black (hitam), red (merah), green (hijau), yellow (kuning), blue (biru), violet (ungu), silver (abu-abu) dan lain-lain.
Selain itu kita juga bisa menggunakan kode heksadesimal yang diterjemahkan ke dalam warna RGB. Ada 6 karakter untuk setiap warna yang diberikan.
Misalnya, merah murni = ff0000, hijau murni = 00FF00, dan murni biru = 0000FF. Dalam hex, 00 = nol, dan ff = 255, nilai maksimum untuk definisi warna RGB. Jika jumlahnya semakin tinggi, semakin cerah warnanya. Misalnya, ffffff = putih murni, sedangkan 000000 = hitam murni. Semua warna yang dibuat, adalah hasil dari berbagai kombinasi di atas. Untuk mengetahui kode-kode warna anda bisa lihat di sini atau anda juga bisa memilih kode warna di Photoshop.
Sekarang mari kita praktekan cara mengatur warna pada teks html, silakan anda ketikan html berikut ini di editor anda
<html>
<head>
<title>Warna Huruf</title>
</head>
<body>
<font color="red">Ini Tulisan Warna Merah</font><br>
<font color="green">Ini Tulisan Warna Hijau</font><br>
<font color="yellow">Ini Tulisan Warna Kuning</font><br>
<font color="blue">Ini Tulisan Warna Biru</font><br>
<font color="ff0000">Ini Tulisan Warna Merah</font>
</body>
</html>

Simpan kode html diatas, kemudian buka file tersebut di browser anda maka tampilannya adalah sebagai berikut.



2. Mengatur Ukuran Huruf 

Untuk mengatur warna pada html yaitu dengan menggunakan tag <font size="ukuran_huruf"> diawal tulisan yang akan diberikan warna dan diakhiri dengan tag </font>. Ketikan kode html di bawah ini.
<html>
<head>
<title>Ukuran Huruf</title>
</head>
<body>
<font size="1">Ini Tulisan Ukuran 1</font><br>
<font size="2">Ini Tulisan Ukuran 2</font><br>
<font size="3">Ini Tulisan Ukuran 3</font><br>
<font size="4">Ini Tulisan Ukuran 4</font><br>
<font size="5">Ini Tulisan Ukuran 5</font><br>
<font size="6">Ini Tulisan Ukuran 6</font><br>
<font size="7">Ini Tulisan Ukuran 7</font>
</body></html>
 Simpan kode html diatas, kemudian buka file tersebut di browser anda maka tampilannya adalah sebagai berikut.


3. Mengatur Jenis Huruf 

Untuk mengatur warna pada html yaitu dengan menggunakan tag <font face="jenis_huruf"> diawal tulisan yang akan diberikan warna dan diakhiri dengan tag </font>. Ketikan kode html di bawah ini.
<html>
<head>
<title>Jenis Huruf</title>
</head>
<body>
<font face="arial">Ini Tulisan Jenis Arial</font><br>
<font face="comic sans ms">Ini Tulisan Jenis Comic Sans MS</font><br>
<font face="tahoma">Ini Tulisan Jenis Tahoma</font><br>
<font face="times new roman">Ini Tulisan Jenis times new roman</font>
</body>
</html>

Simpan kode html diatas, kemudian buka file tersebut di browser anda maka tampilannya adalah sebagai berikut.


Demo Blog NJW V2 Updated at: 22:04:00

2 komentar: