Bagaimana untuk membuat jadual dengan pengepala?-html tutorial-php.cn

Bagaimana untuk membuat jadual dengan pengepala?

WBOY

Lepaskan： 2023-08-24 22:49:03

ke hadapan

1472 orang telah melayarinya

Bagaimana untuk membuat jadual dengan pengepala?

Kami menggunakan teg untuk membuat jadual dengan tajuk dalam HTML. Teg tajuk akan dimasukkan selepas teg Kita boleh menambah tajuk pada jadual. Secara lalai, penjajaran label dipusatkan. Kita boleh menukar penjajaran menggunakan sifat penjajaran CSS.

Tatabahasa

Berikut ialah sintaks tag tajuk HTML

<caption>Caption of the table...</caption>

Salin selepas log masuk

Contoh 1

Dalam contoh di bawah, kami telah mencipta jadual yang mengandungi nama pekerja dan ID pekerja menggunakan Pekerja sebagai tajuk.

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      table,
         tr,
         th,
         td {
            border: 1px solid black;
         }
   </style>
</head>
<body>
   <table>
      <caption>Employees</caption>
      <tr>
         <th>EmployeeName</th>
         <th>EmployeeId</th>
      </tr>
      <tr>
         <td>Yadav</td>
         <td>022</td>
      </tr>
      <tr>
         <td>Abdul</td>
         <td>025</td>
      </tr>
      <tr>
         <td>Jason</td>
         <td>208</td>
      </tr>
   </table>
</body>
</html>

Salin selepas log masuk

Sifat penjajaran

Kita boleh menggunakan penjajaran atribut CSS untuk menukar penjajaran. Berikut ialah sintaksnya:

<caption style="text-align:value" >Caption of the table...</caption>

Salin selepas log masuk

Contoh 2

diterjemahkan sebagai:

Contoh 2

Dalam contoh di bawah, kami menyelaraskan tajuk ke sebelah kiri halaman -

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      table,tr,th,td {
         border:1px solid black;
      }
   </style>
</head>
<body>
   <table>
      <caption style="text-align: left">Employees</caption>
      <tr>
         <th>EmployeeName</th>
         <th>EmployeeId</th>
      </tr>
      <tr>
         <td>Yadav</td>
         <td>022</td>
      </tr>
      <tr>
         <td>Abdul</td>
         <td>025</td>
      </tr>
      <tr>
         <td>Jason</td>
         <td>208</td>
      </tr>
   </table>
</body>
</html>

Salin selepas log masuk

Terjemahan bahasa Cina bagi

Contoh 3

ialah:

Contoh 3

Mari kita lihat satu lagi contoh mencipta tajuk -

<!DOCTYPE html>
<html>
<head>
   <style>
      table,
      td,
      th {
         border: 1px solid black;
      }
   </style>
</head>
<body>
   <table>
      <caption>Authors</caption>
      <tr>
         <th>JavaFX</th>
         <th>Krishna</th>
      </tr>
      <tr>
         <td>Scala</td>
         <td>Satish</td>
      </tr>
   </table>
</body>
</html>

Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk membuat jadual dengan pengepala?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!