Skip to main content

Cara Membuat Tabel Warna di HTML

Dalam pewarnaan HTML dan CSS ada 16 warna dasar dan standar(dalam bentuk nama) yang sering digunakan yaitu :
Black
Silver
Gray
White
Maroon
Red
Purple
Fuchsia
Green Lme Olive Yellow Navy Blue Teal Aqua

Mari kita membuat kode HTML dan CSS yang membentuk tabel dari warna-warna di atas !

 Ketikkanlah script di bawah ini :

<!DOCTYPE HTML>
<html>
<head>
<title>bab 3 lat 17</title>
<style type="text/css">

h1 { border-style: ridge;
border-color: rgb(255, 0, 0);
font-size: 24pt;
border-width: 10px;
float: center;
}

h2 { border-style: groove;
border-width: 15px;
border-color: rgb(121, 32, 22);
font-color: rgb(123, 24, 22);
background-color: rgb(22, 66, 77);
padding: 40px;
font-size: 40pt;
float: center;
font-family: Brush Script, Moonlight, Clarendon;
}
</style>
</head>

<body bgcolor="#FF8337" text="#000000">

<h2>PETA WARNA CSS</h2>

<table border="15" cellspacing="4" cellpadding="10"
   bgcolor="#00FFFF" bordercolor="#779944" align="center"
   width="100%">
<tr>
<th colspan="8">
<font size="6"><h1>16 Warna Berdasarkan Nama</h1></font>
</th>
</tr>

<tr bgcolor="755f11">
<th>Warna></th>
<th>HEX<br>RRGGBB</th>
<th>Fungsi<br>RGB(r#,g#,b#)</th>
<th>Fungsi<br>RGB(r%,g%,b%)</th>
<th>Warna></th>
<th>HEX<br>RRGGBB</th>
<th>Fungsi<br>RGB(r#,g#,b#)</th>
<th>Fungsi<br>RGB(r%,g%,b%)</th>
</tr>

<tr>
<th></th>
</tr>

<tr>
<td bgcolor="#000000"><font color="#ffffff">Black</font></td>
<td bgcolor="#000000"><font color="ffffff">000000</font></td>
<td bgcolor="#000000"><font color="#ffffff">(0,0,0)</font></td>
<td bgcolor="#000000"><font color="#ffffff">(0%,0%,0%)</font></td>
<td bgcolor="#008000"><font color="#ffffff">Green</font></td>
<td bgcolor="#008000"><font color="ffffff">008000</font></td>
<td bgcolor="#008000"><font color="#ffffff">(0,127,0)</font></td>
<td bgcolor="#008000"><font color="#ffffff">(0%,50%,0%)</font></td>
</tr>

<tr>
<td bgcolor="#c0c0c0">Silver</td>
<td bgcolor="#c0c0c0">c0c0c0</td>
<td bgcolor="#c0c0c0">(207,207,207)</td>
<td bgcolor="#c0c0c0">(80%,80%,80%)</td>
<td bgcolor="#00ff00">Lime</td>
<td bgcolor="#00ff00">00ff00</td>
<td bgcolor="#00ff00">(0,255,0)</td>
<td bgcolor="#00ff00">(0%,100%,0%)</td>
</tr>

<tr>
<td bgcolor="#808080">Gray</td>
<td bgcolor="#808080">808080</td>
<td bgcolor="#808080">(127,127,127)</td>
<td bgcolor="#808080">(50%,50%,50%)</td>
<td bgcolor="#808000">Olive</td>
<td bgcolor="#808000">808000</td>
<td bgcolor="#808000">(127,127,0)</td>
<td bgcolor="#808000">(50%,50%,0%)</td>
</tr>

<tr>
<td bgcolor="#ffffff">White</td>
<td bgcolor="#ffffff">ffffff</td>
<td bgcolor="#ffffff">(255,255,255)</td>
<td bgcolor="#ffffff">(100%,100%,100%)</td>
<td bgcolor="#ffff00">Yellow</td>
<td bgcolor="#ffff00">ffff00</td>
<td bgcolor="#ffff00">(255,255,0)</td>
<td bgcolor="#ffff00">(100%,100%,0%)</td>
</tr>


<tr>
<td bgcolor="#800000">Maroon</td>
<td bgcolor="#800000">800000</td>
<td bgcolor="#800000">(127,0,0)</td>
<td bgcolor="#800000">(50%,0%,0%)</td>
<td bgcolor="#000080"><font color="#ffffff">Navy</font></td>
<td bgcolor="#000080"><font color="#ffffff">000080</font></td>
<td bgcolor="#000080"><font color="#ffffff">(0,0,127)</font></td>
<td bgcolor="#000080"><font color="#ffffff">(0%,0%,50%)</font></td>
</tr>


<tr>
<td bgcolor="#ff0000">Red</td>
<td bgcolor="#ff0000">ff0000</td>
<td bgcolor="#ff0000">(255,0,0)</td>
<td bgcolor="#ff0000">(100%,0%,0%)</td>
<td bgcolor="#0000ff"><font color="ffffff">Blue</font></td>
<td bgcolor="#0000ff"><font color="ffffff">0000ff</font></td>
<td bgcolor="#0000ff"><font color="ffffff">(0,0,255)</font></td>
<td bgcolor="#0000ff"><font color="ffffff">(0%,0%,100%)</font></td>
</tr>


<tr>
<td bgcolor="#800080">Purple</td>
<td bgcolor="#800080">800080</td>
<td bgcolor="#800080">(127,0,127)</td>
<td bgcolor="#800080">(50%,0%,50%)</td>
<td bgcolor="#008080">Teal</td>
<td bgcolor="#008080">008080</td>
<td bgcolor="#008080">(0,127,127)</td>
<td bgcolor="#008080">(0%,50%,50%)</td>
</tr>


<tr>
<td bgcolor="#ff00ff">Fucshia</td>
<td bgcolor="#ff00ff">ff0ff</td>
<td bgcolor="#ff00ff">(255,0,255)</td>
<td bgcolor="#ff00ff">(100%,0%,100%)</td>
<td bgcolor="#00ffff">Aqua</td>
<td bgcolor="#00ffff">00ffff</td>
<td bgcolor="#00ffff">(0,255,255)</td>
<td bgcolor="#00ffff">(0%,100%,100%)</td>
</tr>

</body>
</html>


 Hasilnya akan menjadi seperti ini :
contoh table

Jika ada script yang kurang jelas bisa ditanyakan di kolom komentar. Semoga ilmu yang dibagikan dapat bermanfaat.Terima kasih !
Labels:

Comments

Post a Comment

Popular posts from this blog

Cara Aktivasi Microsoft Office 2013 atau 2016 dengan KMS Auto Lite

Aktivasi Microsoft Office 2013 atau 2016 Menggunakan KMS Auto Lite Jika anda tidak memiliki product key Misrosoft Office 2013 atau 2016, dan ingin melakukan aktivasi maka disarankan untuk menggunakan tool aktivator. Salah satu tool aktivator Windows dan Office yang cukup populer adalah KMS Auto Lite. Tool ini sangat mudah digunakan, sehingga proses aktivasi Microsoft Office 2013 atau 2016 bisa dilakukan oleh siapa saja. Untuk menggunakan tool ini dan melakukan aktivasi office, silahkan simak langkah-langkah berikut. (Baca juga: Cara Aktivasi Office 2019 Permanen Secara Offline) Jika hendak melakukan aktivasi office 2013 atau 2016 menggunakan KMS Auto Lite, maka anda harus memastikan tool tersebut sudah tersedia dan dapat digunakan pada komputer anda. Jika belum memilikinya, silahkan download KMS Auto Lite disini . Setelah anda download, silahkan ekstrak File KMS Auto Lite tersebut jika masih dalam format rar. Selanjutnya, buka folder hasil ekstrak KMS Auto Lite. Pada fold...
Post a Comment
Read more

Download Windows 7 Starter Full Version Free ISO

Dapatkan Versi Lengkap Windows 7 Starter Lengkap Gratis Unduh ISO, dirilis oleh Microsoft. Tautan langsung Versi Lengkap Windows 7 Starter Free Download baru-baru ini ditambahkan di Softlay.net License : Official ISO / Product Key OS : Windows 7 Language : English Latest Release : 22 Feb 2011 Version : Starter SP1 File Size : 2.46 GB (32bit) Provided By : Microsoft Inc. Windows 7 Starter Versi Lengkap Gratis Tinjauan Unduhan ISO  : Windows 7 Starter adalah edisi paling dasar dari sistem operasi Windows yang dirilis oleh Microsoft. Ini hanya tersedia sebagai pra-instal (lisensi OEM). Windows 7 hadir dalam enam edisi yang berbeda (Starter, Home basic, Home premium, Enterprise, Professional dan Ultimate). Beberapa di antaranya banyak digunakan dan tersedia sebagai Ritel atau VL. Jadi, jika Anda perlu mengoptimalkan kecepatan PC dan mendapatkan kinerja terbaik, Anda harus mengunduh windows 7. Fitur Starter Windows 7  : Windows dengan fitur paling ...
Post a Comment
Read more

Pengertian Musik menurut Para Ahli

Musik adalah suara yang disusun sedemikian rupa sehingga mengandung irama, lagu, nada, dan keharmonisan terutama dari suara yang dihasilkan dari alat-alat yang dapat menghasilkan irama. Walaupun musik adalah sejenis fenomena intuisi, untuk mencipta, memperbaiki dan mempersembahkannya adalah suatu bentuk seni. Mendengar musik adalah sejenis hiburan. Musik adalah sebuah fenomena yang sangat unik yang bisa dihasilkan oleh beberapa alat musik. Arti Musik Menurut KBBI Arti musik menurut KBBI (Kamus Besar Bahasa Indonesia) adalah ilmu atau seni menyusun nada atau suara dalam urutan, kombinasi, dan hubungan temporal untuk menghasilkan komposisi (suara) yang mempunyai kesatuan dan kesinambungan. Definisi musik juga bisa diartikan sebagai nada atau suara yang disusun demikian rupa sehingga mengandung irama, lagu, dan keharmonisan (terutama yang menggunakan alat-alat yang dapat menghasilkan bunyi-bunyi itu). Pengertian Musik Menurut Para Ahli Berikut ini adalah beberapa definisi d...
1 comment
Read more