Penggunaan Elemen Quotation dan Citation pada HTML

Penggunaan Warna pada HTML

—

by

Webbiz.ID
in

Berikut ini adalah contoh Penggunaan Warna pada HTML beserta penjelasan lengkap pada setiap kode yang digunakan:

1. Warna dengan nama

HTML
<p style="color: red;">Ini adalah teks berwarna merah.</p>
<p style="color: blue;">Ini adalah teks berwarna biru.</p>
<p style="color: green;">Ini adalah teks berwarna hijau.</p>
HTML

2. Warna dengan Kode Hexadecimal

HTML
<p style="color: #FF0000;">Ini adalah teks berwarna merah.</p>
<p style="color: #0000FF;">Ini adalah teks berwarna biru.</p>
<p style="color: #00FF00;">Ini adalah teks berwarna hijau.</p>
HTML

3. Warna dengan Kode RGB

HTML
<p style="color: rgb(255, 0, 0);">Ini adalah teks berwarna merah.</p>
<p style="color: rgb(0, 0, 255);">Ini adalah teks berwarna biru.</p>
<p style="color: rgb(0, 255, 0);">Ini adalah teks berwarna hijau.</p>
HTML

4. Warna dengan Kode RGBA

HTML
<p style="color: rgba(255, 0, 0, 0.5);">Ini adalah teks berwarna merah dengan transparansi 50%.</p>
<p style="color: rgba(0, 0, 255, 0.5);">Ini adalah teks berwarna biru dengan transparansi 50%.</p>
<p style="color: rgba(0, 255, 0, 0.5);">Ini adalah teks berwarna hijau dengan transparansi 50%.</p>
HTML

5. Warna dengan Nama dan Background

HTML
<p style="color: white; background-color: red;">Ini adalah teks berwarna putih dengan latar belakang merah.</p>
<p style="color: white; background-color: blue;">Ini adalah teks berwarna putih dengan latar belakang biru.</p>
<p style="color: white; background-color: green;">Ini adalah teks berwarna putih dengan latar belakang hijau.</p>
HTML

6. Warna dengan Kode Hexadecimal dan Background

HTML
<p style="color: white; background-color: #FF0000;">Ini adalah teks berwarna putih dengan latar belakang merah.</p>
<p style="color: white; background-color: #0000FF;">Ini adalah teks berwarna putih dengan latar belakang biru.</p>
<p style="color: white; background-color: #00FF00;">Ini adalah teks berwarna putih dengan latar belakang hijau.</p>
HTML

7. Warna dengan Kode RGB dan Background

HTML
<p style="color: white; background-color: rgb(255, 0, 0);">Ini adalah teks berwarna putih dengan latar belakang merah.</p>
<p style="color: white; background-color: rgb(0, 0, 255);">Ini adalah teks berwarna putih dengan latar belakang biru.</p>
<p style="color: white; background-color: rgb(0, 255, 0);">Ini adalah teks berwarna putih dengan latar belakang hijau.</p>
HTML

8. Warna dengan Kode RGBA dan Background

HTML
<p style="color: white; background-color: rgba(255, 0, 0, 0.5);">Ini adalah teks berwarna putih dengan latar belakang merah dan transparansi 50%.</p>
<p style="color: white; background-color: rgba(0, 0, 255, 0.5);">Ini adalah teks berwarna putih dengan latar belakang biru dan transparansi 50%.</p>
<p style="color: white; background-color: rgba(0, 255, 0, 0.5);">Ini adalah teks berwarna putih dengan latar belakang hijau dan transparansi 50%.</p>
HTML

Dengan menggunakan kode-kode di atas, Anda dapat mengatur warna teks dan latar belakang pada elemen HTML sesuai dengan kebutuhan Anda.

Output:

See the Pen Penggunaan Warna pada HTML by De Orchids (@De-Orchids) on CodePen.

Artikel Terbaru ⭐