Cara Merubah Warna Background Pada tabel HTML

Metode untuk mengubah warna background bagian-bagian tabel di situs web telah berkembang.

Bahkan sekarang menjadi lebih mudah dan tidak terlalu susah karena cukup drag dan drop serta change color.

Metode yang lebih lama menggunakan atribut bgcolor untuk mengubah warna background tabel. Ini juga bisa digunakan untuk mengubah warna baris tabel atau sel tabel. Namun atribut bgcolor sudah tidak digunakan lagi untuk mendukung style sheet, jadi ini bukan cara optimal untuk memanipulasi warna latar belakang tabel.

Cara yang lebih baik untuk mengubah warna latar belakang adalah dengan menambahkan warna background properti background-color, baris, atau tag sel.

Contoh ini mengubah warna background seluruh tabel:

<table style="background-color: #ff0000;">

Untuk mengubah warna satu baris, masukkan properti warna background di tag :

<tr style="background-color: yellow;">

Anda dapat mengubah warna satu sel dengan menambahkan atribut ke tag :

<td style="background-color: #000;">

Anda juga dapat menerapkan warna background ke kepala tabel, atau tag , dengan cara yang sama:

<th style="background-color: #000;">

Mengubah Warna Background Menggunakan Style Sheets

Namun, lebih baik hindari menggunakan atribut background-color untuk mendukung style sheet yang diformat dengan benar. Misalnya, Anda dapat menyetel style dalam style sheet di HEAD dokumen HTML Anda atau menyetelnya di style sheet eksternal. Perubahan seperti ini di HEAD atau di style sheet eksternal mungkin muncul seperti ini untuk tabel, baris, dan sel:

table { background-color: #ff0000; }
tr { background-color: yellow; }
td { background-color: #000; }

Mengatur Warna Background pada Kolom

Cara terbaik untuk menyetel warna BAckground pada kolom adalah dengan membuat style class dan kemudian menetapkan classs tersebut ke sel di kolom itu.

CSS nya :

td.ColColor { background-color: blue; }

Dan HTML nya :

<table>
<tr><td class="ColColor">cell 1</td><td>cell 2</td></tr>
<tr><td class="ColColor">cell 1</td><td>cell 2</td></tr>
</table>

Satu keuntungan signifikan dari mengontrol warnabackground melalui style sheet adalah Anda dapat mengubah pilihan warna Anda di lain waktu. Daripada harus melalui dokumen HTML dan membuat perubahan ke setiap sel, Anda dapat membuat satu perubahan pada pilihan warna di CSS yang akan segera diterapkan ke setiap contoh di mana  class=”ColColor” dapat anda gunakan sebagai syntac

1 Shares:
Leave a Reply

Your email address will not be published.

You May Also Like