Când se folosesc tabele TABLE, începătorii în producția HTML vor întâmpina cum să schimbe grosimea muchiei, deoarece setarea implicită a muchiei TABLE este foarte groasă chiar dacă este 1px. Prin urmare, există și alte metode folosite pentru a crea margini subțiri, iar aici este o metodă de utilizare a CSS pentru implementarea liniilor subțiri, care este foarte eficientă și compatibilă cu toate browserele.
Dacă setezi pur și simplu marginea pentru un tabel subțire de linii, este dificil să te asiguri că browserul este compatibil. O practică comună este utilizarea "border-collapse:collapse" a CSS2; granițele tabelelor de fuziune a atributelor; Și setează marginile din stânga și de sus pentru elementele tabelului, iar marginile din dreapta și de jos pentru elementele th și td.
HTML:
<table> <tr> <th>Cap de tabel (rând1, col1)</th> <th>Cap de tabel (rând1, col2)</th> <th>Cap de tabel (rând1, col3)</th> </tr> <tr> <td>Date de tabel (rând1, col1)</td> <td>Date de tabel (rând1, COL2)</td> <td>Date de tabel (rând1, COL3)</td> </tr> <tr> <td>Date de tabel (rând2, COL1)</td> <td>Date de tabel (rând2, COL2)</td> <td>Date din tabel (row2, col3)</td> </tr> CSS</table>:
tabel{colaps de graniță:colaps; distanțarea dintre granițe: 0; Marginea stânga: 1px solid #888; Marginea de sus: 1px solid #888; Context:#efefef; } th,td{border-right:1px solid #888; marginea de jos: 1px solid #888; Padding: 5px 15px; } th{font-weight:bold; Context:#ccc; } |