Cara Mengubah Background di Tabel HTML


Di artikel sebelumnya, saya telah membagikan kelada sobat tentang cara membuat tabel dengan kode HTML. Nah selanjutnya di artikel ini saya akan berbagi cara untuk mengubah background pada tabel HTML. Seperti apa cara melakukannya? Berikut pembahasannya.

Cara Mengubah Background di Tabel HTML

Mengubah Background di Tabel HTML

Nah, untuk mengubah background di tabel HTML sangatlah mudah dan pastinya cepat.

Trus caranya bagaimana, bro?
Nah agar dapat mengubah background yang ada di setiap kolom tabel sangatlah mudah seperti yang telah saya katakan di atas. Caranya, yaitu sebagai berikut.

#1. Jika sobat hanya ingin mengubah background pada satu kolom saja, sobat hanya perlu menambahakn sebuah atribut bgcolor="nama_warna" pada tag <td> yang ada pada tabel.

Maksudnya bagaimana, bro?
Nah, maksudnya seperti ini.
Untuk meberikan nilai warna pada atribut bgcolor="", sobat bisa mengisinya dengan empat cara, yaitu sebagai berikut.
  1. Dengan menuliskan nama warna dalam bahasa inggris, misalnya.
    <td bgcolor="blue">Jalur Super Blog</td>
  2. Dengan menggunakn kode hex warna, misalnya untuk warna biru, yaitu
    <td bgcolor="#0000FF">Jalur Super Blog</td>
  3. Dengan menggunakan kode rgb, misalnya untuk warna merah, yaitu
    <td bgcolor="rgb(0, 0, 255)">Jalur Super Blog</td>
  4. Terakhir, dengan menggunakan kode CSS. Untuk penjelasannya berikut ini.

Mengubah Background Tabel dengan CSS

Untuk cara terakhir diatas ini, yaitu dengan kode CSS, agak sedikit berbeda dengan cara pertama dan kedua. Karna untuk penggunanya terbagi menjadi dua.

Caranya seperti apa?
Kedua cara tersebut ialah sebagai berikut.

  • Dengan menambahkan atribut style="background: nama_warna" tag yang ini diubah backgroundnya. Contohnya.
    <td style="background: yellow;">Jalur Super Blog</td>
  • Dengan membuat selector baru di dalam tag style. Untuk contohnya bisa dilihat di bawah ini.
<style>
/* Cara pertma */
Table tr td {
background: blue;
}

/* Bisa juga dengan cara kedua seperti berikut */
td {
background: red;
{
</style>

Keterangan:
Di tag style, cara partama menunjukkan selector table tr td. Artinya, semua tag <td> yang terdapat di tag <table> dan <tr> backgroundnya akan berubah menjadi biru.

Selanjutnya, di cara kedua hanya memunjukkan satu selector saja, yaitu td. Artinya, semua yang merupakan tag <td> baik itu yang ada di dalam tah <table> dan <tr> atau tidak, semuanya akan berubah background menjadi merah (red)

Nah, mungkin seperi itulah caranya. Saran saya, lakukan salah satu cara diatas yang menurut sobat mudah.

Ok sekian dulu artikel codingnya kali ini semoga dapat bermanfaat dan terima kasih atas kunjungannya ke artikel sederhana ini. Salam Anak Bangsa!

Feri irawan Blogger asal Sulawesi Selatan yang jarang posting artikel.

0 Response to "Cara Mengubah Background di Tabel HTML"

Post a Comment

Silahkan tinggalkan komentar Anda jika artikel ini bermanfaat. Anda juga dapat meninggalkan pertanyaan atau saran.

Semua komentar dapat saya baca, namun tidak semuanya dapat saya balas. Mohon dimaklumi

Jika kolom komentar tidak tampil, silahkan ubah akhir URL m=1 menjadi m=0

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel