Cara Memberi Warna Text Website dengan HTML

Cara Memberi Warna Text Website dengan HTML

CARA MEMBERI WARNA TEXT WEBSITE DENGAN HTML

Cara Memberi Warna Text Website dengan HTML – Tahukah Anda bagaimana cara memberi warna text website dengan HTML? Mungkin bagi orang awam hal seperti ini sangat buta bukan, untuk itu mari kita bahas bersam-sama cara meberi warna text website dengan HTML.

Memberi Warna Pada Teks Dengan HTML

Cara untuk melakukan pemberian warna pada teks yang ada pada halaman website, kita akan menggunakan tag <FONT COLOR>. Berdasarkan sejarah, penggunaan warna pada teks web page itu diperkenalkan pertama kali oleh Explorer 1.0 dengan menggunakan atribut COLOR pada elemen tag FONT.

Cara mendefinisikan warna pada tag <FONT COLOR> ini ada dua cara, yaitu dengan menggunakan nama warnanya langsung dalam bahasa inggris dan dengan menggunakan kode RGB atau Hex Code suatu warna.

Contoh penggunaan dengan menggunakan nama warnanya langsung dalam bahasa inggris adalah sebagai berikut : <FONT COLOR=”red”>

Untuk Nama warna lainnya dalam bahasa inggris ini bisa anda simak contoh lainnya disini :

Aqua, Black, Blue, Green, White, Red, Yellow, Olive, Fuchsia, Silver, Lime, Navy, Purple, Gray, Teal, Maroon

Kode Nama warna diatas bisa anda pakai nanti pada penggunaan tag <FONT COLOR> tadi diatas sebagai variasi penggunanaan.

Sedangkan penggunaan dengan menggunakan kode RGB suatu warna adalah sebagai berikut : <FONT COLOR=”#FF0000″>

kode #FF0000 diatas disebut Hex Code. Penulisannya diawali dengan karakter pagar “#” lalu diikuti kode RGB nya.

Untuk mengetahui kode RGB atau Hex Code lainnya ini silahkan lihat daftarnya dibawah ini :

#FF0000 = Hex Code untuk Warna Merah

#0000FF = Hex Code untuk Warna Biru

#FFFF00 = Hex Code untuk Warna Kuning

#FFFFFF = Hex Code untuk Warna Putih

#00FFFF = Hex Code untuk Warna Cyan

#888888 = Hex Code untuk Warna Abu-abu

#00FF00 = Hex Code untuk Warna Hijau

#FF8800 = Hex Code untuk Warna Orange

#000000 = Hex Code untuk Warna Hitam

#AA8800 = Hex Code untuk Warna Coklat

#004488 = Hex Code untuk Warna Navy

atau anda bisa juga melihat tabel dibawah ini :

daftar hex code html

Nama warna dan Kode RGB atau Hex Code diatas baru sebagian saja dari kode-kode yang ada tapi lumayan untuk pembelajaran HTML anda. Silahkan digunakan dalam pembelajaran anda sebagai pilihan variasi warna.

Tentang bagaimana cara penggunaannya silahkan anda buka Notepad anda lalu copy paste kode-kode HTML dibawah ini.

<html>
<header>
<title>
Memberi Warna Pada Teks Dengan HTML
</title>
</header><body><font color=”red”>ini contoh teks berwarna red tanpa penggunaan Tag Font Size</font><br><font color=”green”>ini contoh teks berwarna green tanpa penggunaan Tag Font Size</font><br><font size=6 color=”aqua”>ini contoh teks berwarna aqua dengan penggunaan Tag Font Size 6</font><br><font size=6 color=”olive”>ini contoh teks berwarna olive dengan penggunaan Tag Font Size 6</font><br><font size=6 color=”fuchsia”>ini contoh teks berwarna fuchsia dengan penggunaan Tag Font Size 6</font><br><font size=5 color=”#00FF00″>ini contoh teks berwarna Hex Code #00FF00 dan penggunaan Tag Font Size 5</font><br></body>
</html>

Setelah kode diatas di copy paste pada Notepad anda, silahkan save dengan nama file yang anda inginkan misalnya nama file nya adalah memberiwarnapadateks.html jangan lupa kasih tanda titik dibelakang nama filenya seperti contoh tadi lalu beri ekstensi .html agar ketika disave nantinya menjadi file HTML.

Jika sudah tersimpan, maka silahkan anda cari file yang baru saja anda simpan tadi lalu klik 2x untuk melihat tampilannya di browser. Tampilannya harusnya seperti gambar dibawah ini.

Tampilan Kode Memberi Warna Pada Teks HTML

Pada kode HTML diatas saya gunakan tag lain yang sudah saya bahas pada artikel sebelumnya yaitu penggunaan tag <FONT SIZE>. Untuk merefresh ingatan anda atau jika anda belum membacanya silahkan baca dulu artikel saya sebelumnya yang berjudul Memformat Ukuran Huruf Tetap dan Penggunaan Heading Dengan HTML agar anda lebih faham cara penggunaannya.

Silahkan anda cermati kode-kode HTML yang baru saja anda buat diatas tadi, dan bedakan mana yang menggunakan nama warna dalam bahasa inggris dan mana yang menggunakan Kode RGB atau Hex Code.

Memberi Warna Pada Background Halaman Website Dengan HTML

Setelah anda faham bagaimana cara penggunaan <Font Color> untuk mewarnai teks diatas, maka sekarang waktunya anda belajar bagaimana caranya memberi warna pada Background Halaman website anda.

Tag yang digunakan untuk memberi warna pada Background Halaman website anda adalah tag <BGCOLOR>. Tag <BGCOLOR> ini tata letaknya berbeda pada penggunaan <Font Color> diatas.

Tag <Font Color> tadi diletakkan di antara tag <BODY> pembuka dan tag </BODY> penutup, sedangkan penggunaan <BGCOLOR> ini dia melekat pada tag <BODY> itu sendiri. Untuk memahaminya lihat contoh penggunaannya :

<body BGCOLOR=”black”>

Pada contoh diatas bila kita eksekusi nantinya background halaman website anda akan berwarna hitam. Untuk melihat hasilnya silahkan anda copy paste kode-kode berikut pada notepad anda. Lakukan cara yang sama seperti cara diatas tadi. Simpan filenya dalam bentuk HTML lalu klik 2x untuk melihat hasil tampilannya. Kode untuk melihat penggunaan tag <body BGCOLOR=”black”> diatas tadi adalah sebagai berikut :

<html>
<header>
<title>
Memberi Warna Pada Background Halaman Website Dengan HTML
</title>
</header><body bgcolor=”black”><font color=”red”>ini contoh teks berwarna red tanpa penggunaan Tag Font Size</font><br><font color=”green”>ini contoh teks berwarna green tanpa penggunaan Tag Font Size</font><br><font size=6 color=”aqua”>ini contoh teks berwarna aqua dengan penggunaan Tag Font Size 6</font><br><font size=6 color=”olive”>ini contoh teks berwarna olive dengan penggunaan Tag Font Size 6</font><br><font size=6 color=”fuchsia”>ini contoh teks berwarna fuchsia dengan penggunaan Tag Font Size 6</font><br><font size=5 color=”#00FF00″>ini contoh teks berwarna Hex Code #00FF00 dan penggunaan Tag Font Size 5</font><br></body>
</html>

Maka tampilannya akan seperti gambar dibawah ini :

Tampilan Kode Memberi Warna Pada Background Html

JOGJA ONE SOLUTION – KURSUS BISNIS ONLINE JOGJA | JASA PROMOSI JOGJA | JASA PEMBUATAN WEBSITE JOGJA | INTERNET MARKETING JOGJA | JASA SEO JOGJA | AHLI WEBSITE | PELATIHAN INTERNET MARKETING | SOFTWARE APLIKASI JOGJA | JASA SOFTWARE JOGJA Kami hadir memberi solusi untuk kebutuhan media promosi bisnis atau usaha Anda. Grafik order dan omzet meningkat. Dapatkan website murah, desain menarik, kompleks, dan full maintenance dengan harga yang terjangkau KLIK DISINI. Atau hubungi kami di Telp (0274) 5017127 | WA : 0888 0289 8802


Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

WhatsApp chat