Bagaimana untuk menambah garis mendatar ke jadual dalam php-masalah PHP-php.cn

Bagaimana untuk menambah garis mendatar ke jadual dalam php

PHPz

Lepaskan： 2023-04-03 16:10:01

asal

1394 orang telah melayarinya

Dalam PHP, menambah garis mendatar pada jadual boleh dicapai dengan menambahkan gaya CSS.

CSS (Cascading Style Sheets) ialah bahasa yang digunakan untuk mengawal gaya dan reka letak halaman web dan boleh menambah gaya pada elemen HTML. Dengan menambahkan gaya CSS tertentu, elemen jadual boleh dipaparkan sebagai jadual dengan garisan mendatar pada halaman web.

Berikut ialah langkah-langkah untuk menambah garisan mendatar pada jadual:

Langkah 1: Buat elemen jadual HTML

Pertama, buat elemen jadual dalam HTML Anda boleh gunakan teg jadual dan teg lain yang berkaitan untuk mencapainya.

Berikut ialah contoh jadual HTML ringkas:

<table>
  <tr>
    <th>姓名</th>
    <th>性别</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>男</td>
    <td>28</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>女</td>
    <td>32</td>
  </tr>
</table>

Salin selepas log masuk

Dalam kod di atas, jadual data ringkas dicipta melalui elemen jadual, yang mengandungi tiga lajur: nama, jantina dan umur, dan Dua baris data.

Langkah 2: Tambah gaya CSS

Seterusnya, tambah gaya CSS dalam PHP untuk menambah garisan mendatar pada jadual.

Berikut ialah contoh menggunakan gaya CSS untuk menambah garisan mendatar pada jadual:

<style type="text/css">
table {
  border-collapse: collapse;
  width: 100%;
}

table th, table td {
  border: 1px solid #ccc;
}

table th {
  background-color: #f7f7f7;
  font-weight: bold;
}

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

table tr:hover {
  background-color: #eaeaea;
}
</style>

Salin selepas log masuk

Dalam kod di atas, gaya jadual ditentukan dan sempadan dan lebar jadual ditetapkan . Pada masa yang sama, gaya sempadan pengepala jadual dan sel kandungan, serta warna latar belakang dan kesan tebal pengepala jadual ditakrifkan. Dengan menetapkan warna latar belakang baris bernombor genap dan tuding tetikus, kesan jadual dengan garisan mendatar dicapai.

Langkah 3: Gunakan gaya CSS pada elemen jadual HTML

Akhir sekali, gunakan gaya CSS di atas pada elemen jadual HTML.

Berikut ialah contoh kod PHP yang lengkap:

<!DOCTYPE html>
<html>
<head>
  <title>PHP Table Style</title>
  <meta charset="UTF-8">
  <style type="text/css">
    table {
      border-collapse: collapse;
      width: 100%;
    }

    table th, table td {
      border: 1px solid #ccc;
    }

    table th {
      background-color: #f7f7f7;
      font-weight: bold;
    }

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

    table tr:hover {
      background-color: #eaeaea;
    }
  </style>
</head>
<body>
  <table>
    <tr>
      <th>姓名</th>
      <th>性别</th>
      <th>年龄</th>
    </tr>
    <tr>
      <td>张三</td>
      <td>男</td>
      <td>28</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>女</td>
      <td>32</td>
    </tr>
  </table>
</body>
</html>

Salin selepas log masuk

Dengan menjalankan kod PHP di atas, jadual data dengan garisan mendatar boleh dipaparkan pada halaman web.

Ringkasan

Dalam PHP, menambahkan garisan mendatar pada jadual boleh dicapai dengan menambahkan gaya CSS. Dengan menetapkan atribut gaya seperti sempadan jadual, warna latar belakang baris bernombor genap dan kesan tuding tetikus, elemen jadual boleh dipaparkan sebagai jadual dengan garisan mendatar pada halaman web.

Atas ialah kandungan terperinci Bagaimana untuk menambah garis mendatar ke jadual dalam php. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!