Rumah >hujung hadapan web >tutorial css >Bagaimana untuk mengalih keluar sempadan jadual dalam css
Bagaimana untuk mengalih keluar sempadan jadual dalam css
- 青灯夜游asal
- 2021-10-12 15:55:3210021semak imbas
Kaedah pengalihan keluar: 1. Tambahkan gaya "sempadan:0;" pada elemen jadual, ke, dan td 2. Tambahkan "gaya sempadan: tiada;" 3 . Tambahkan "border:transparent;" pada elemen jadual, ke dan td.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.
Berikut ialah dokumen HTML dengan jadual
<table border="1"> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr> <td>Peter</td> <td>20</td> </tr> <tr> <td>Lois</td> <td>20</td> </tr> </table>
Ia boleh dilihat bahawa jadual mempunyai sempadan, jadi apa yang perlu saya lakukan jika saya mahu mengalih keluar sempadan jadual? Beberapa kaedah diperkenalkan di bawah.
Kaedah 1: Tambahkan gaya border: 0; pada elemen jadual, ke, td
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
table,th,td {
border: 0;
}
</style>
</head>
<body>
<table border="1">
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>Peter</td>
<td>20</td>
</tr>
<tr>
<td>Lois</td>
<td>20</td>
</tr>
</table>
</body>
</html>Rendering:
Kaedah 2: Tambah border-style: none; gaya pada jadual, ke, elemen td
<style>
table,th,td {
border-style: none;
}
</style>
Kaedah 3: Berikan Tambah border: transparent; gaya ke jadual, ke, dan elemen td
<style>
table,th,td {
border: transparent;
}
</style>
(Mempelajari perkongsian video: tutorial video css)
Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar sempadan jadual dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!