Når man bruger TABLE-tabeller, vil begyndere i HTML-produktion støde på, hvordan man ændrer kanttykkelsen, fordi standardindstillingen for TABLE-kanten er meget tyk, selv hvis den er 1px. Derfor findes der andre metoder til at skabe tynde linjekanter, og her er en metode til at bruge CSS til at implementere tynde linjer, hvilket er meget effektivt og kompatibelt med alle browsere.
Hvis du blot sætter kanten til en tynd linjetabel, er det svært at sikre, at browseren er kompatibel. En almindelig praksis er at benytte CSS2's "border-collapse:collapse;" Attribut-sammenfletningstabellens grænser; Og sæt venstre og øverste kanter for tabelelementer, og højre og bund for th- og td-elementer.
HTML:
<table> <tr> <th>Tabelhoved (Række1, Kol1)</th> <th>Tabelhoved (Række1, Kol2)</th> <th>Tabelhoved (Række1, Kol3)</th> </tr> <tr> <td>Tabeldata (Række1, Kol1)</td> <td>Tabeldata (Række1, Kol2)</td> <td>Tabeldata (Række1, Kol3)</td> </tr> <tr> <td>Tabeldata (Række2, Kol1)</td> <td>Tabeldata (Række2, Kol2)</td> <td>Tabeldata (række2, kol3)</td> </tr>
CSS</table>:
table{border-collapse:collapse; grænseafstand: 0; border-left:1px solid #888; border-top: 1px solid #888; Baggrund: #efefef; }
th,td{border-right:1px solid #888; Kant-bund: 1px solid #888; polstring: 5px 15px; }
th{font-weight:bold; Baggrund: #ccc; } |
Opslået på 18/04/2015 22.19.21
|
|
|
|
Opslået på 15/07/2015 01.06.57
|
Udlejer|
Opslået på 11/03/2021 10.51.40
|
Tjek støtten
