html warna tetapan warna jadual

Analisis ringkas teknik penetapan warna jadual HTML

Dalam reka bentuk web, jadual merupakan salah satu elemen yang sangat diperlukan. Jadual boleh mempersembahkan data dengan jelas, menjadikan kandungan web lebih cantik dan lebih mudah difahami. Untuk menjadikan meja lebih cantik, adalah penting untuk menetapkan warna meja.

Dalam HTML, kita boleh menetapkan warna jadual dalam beberapa cara, termasuk menggunakan helaian gaya CSS, menggunakan atribut gaya secara langsung dalam teg HTML dan menggunakan nama warna yang dipratentukan. Berikut ialah pandangan terperinci tentang cara menyediakannya.

1. Gunakan helaian gaya CSS untuk menetapkan warna jadual

Anda boleh menggunakan sifat warna latar belakang dalam CSS untuk menetapkan warna latar belakang jadual. Sifat ini boleh digunakan pada keseluruhan jadual, baris jadual, sel jadual dan elemen lain. Berikut ialah contoh:

table {
  background-color: #f2f2f2;
}

tr:nth-child(even) {
  background-color: #ccc;
}

td {
  background-color: #fff;
}

Dalam contoh ini, kami menetapkan warna latar belakang kepada kelabu terang untuk keseluruhan jadual dan kelabu untuk baris genap dalam jadual (menggunakan pseudo-class:nth-child) , tetapkan warna latar belakang sel jadual kepada putih.

2 secara langsung menggunakan atribut gaya dalam teg HTML untuk menetapkan warna jadual

Selain menggunakan helaian gaya CSS, kami juga boleh menetapkan warna jadual secara langsung dengan menetapkan atribut gaya dalam warna tag HTML. Berikut ialah contoh:

<table style="background-color:#f2f2f2;">
  <tr>
    <td style="background-color:#fff;">内容</td>
    <td style="background-color:#ccc;">内容</td>
  </tr>
  <tr>
    <td style="background-color:#ccc;">内容</td>
    <td style="background-color:#fff;">内容</td>
  </tr>
</table>

Dalam contoh ini, kami menggunakan atribut gaya dalam teg jadual untuk menetapkan warna latar belakang jadual. Dalam label sel, kami juga menggunakan atribut gaya untuk menetapkan warna latar belakang sel masing-masing.

3. Gunakan nama warna yang dipratentukan

Selain menggunakan kod warna atau nilai warna RGB, HTML juga menyediakan 18 nama warna penyemak imbas pratakrif untuk kami gunakan. Nama warna ini sepadan dengan perkataan Inggeris yang mewakili warna, seperti merah sepadan dengan merah, biru sepadan dengan biru, dsb. Anda boleh menggunakan nama warna ini pada sel jadual atau elemen lain. Berikut ialah contoh:

<table>
  <tr>
    <td style="background-color:red;">内容</td>
    <td style="background-color:blue;">内容</td>
  </tr>
  <tr>
    <td style="background-color:green;">内容</td>
    <td style="background-color:yellow;">内容</td>
  </tr>
</table>

Dalam contoh ini, kami menggunakan nama warna yang dipratentukan untuk menetapkan warna latar belakang sel.

Ringkasan

Jadual ialah salah satu elemen yang sangat diperlukan dalam reka bentuk web. Dengan menetapkan warna meja, kami boleh meningkatkan estetika meja dengan sangat baik. Dalam HTML, kita boleh menggunakan helaian gaya CSS, menetapkan atribut gaya teg HTML dan menggunakan nama warna yang dipratentukan untuk menetapkan warna jadual. Memilih cara yang sesuai untuk menetapkan warna meja boleh mencapai kesan estetik reka bentuk web dengan lebih baik.

Atas ialah kandungan terperinci html warna tetapan warna jadual. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!