När man använder TABLE-tabeller kommer nybörjare inom HTML-produktion att stöta på hur man ändrar kanttjockleken, eftersom standardinställningen för TABLE-kanten är mycket tjock även om den är 1px. Därför finns det andra metoder som används för att skapa tunna linjeramar, och här är en metod för att använda CSS för att implementera tunna linjer, vilket är mycket effektivt och kompatibelt med alla webbläsare.
Om du bara sätter kanten för en tunn linjetabell är det svårt att säkerställa att webbläsaren är kompatibel. En vanlig praxis är att använda CSS2:s "border-collapse:collapse;" tabellgränser för attributsammanslagning; Och sätt vänster och övre gräns för tabellelement, och höger och nedre gränser för th- och td-element.
HTML:
<table> <tr> <th>Tabellhuvud (rad1, kol1)</th> <th>Tabellhuvud (rad1, kol2)</th> <th>Tabellhuvud (rad1, kol3)</th> </tr> <tr> <td>Tabelldata (rad1, kol1)</td> <td>Tabelldata (Rad1, Kol2)</td> <td>Tabelldata (Rad1, Kol3)</td> </tr> <tr> <td>Tabelldata (Rad2, Kol1)</td> <td>Tabelldata (Rad2, Kol2)</td> <td>Tabelldata (rad2, kol3)</td> </tr>
CSS</table>:
table{border-collapse:collapse; gränsavstånd: 0; Border-left:1px solid #888; Border-top:1px solid #888; Bakgrund: #efefef; }
th,td{border-right:1px solid #888; Border-bottom: 1px solid #888; utfyllning: 5px 15px; }
th{font-weight:bold; Bakgrund: #ccc; } |
Publicerad på 2015-04-18 22:19:21
|
|
|
|
Publicerad på 2015-07-15 01:06:57
|
Hyresvärd|
Publicerad på 2021-03-11 10:51:40
|
Kolla in supporten
