Izmantojot TABLE tabulas, iesācēji HTML ražošanā saskarsies ar to, kā mainīt malas biezumu, jo noklusējuma TABLE malas iestatījums ir ļoti biezs, pat ja tas ir 1px. Tāpēc ir arī citas metodes, ko izmanto, lai izveidotu plānas līnijas, un šeit ir metode, kā izmantot CSS, lai ieviestu plānas līnijas, kas ir ļoti efektīva un saderīga ar visām pārlūkprogrammām.
Ja vienkārši iestatāt plānu līniju tabulas apmali, ir grūti nodrošināt, ka pārlūkprogramma ir saderīga. Izplatīta prakse ir izmantot CSS2 "border-collapse:collapse;" atribūtu sapludināšanas tabulas robežas; Un iestatiet tabulas elementu kreiso un augšējo apmali, kā arī labo un apakšējo apmali th un td elementiem.
HTML:
<table> <tr> <th>tabulas galva (1. rinda, 1. rinda)</th> <th>tabulas galva (1. rinda, 2. rinda)</th> <th>tabulas galva (1. rinda, 3. rinda)</th> </tr> <tr> <td>tabulas dati (1. rinda, 1. kolonna)</td> <td>tabulas dati (1. rinda, 2. rinda)</td> <td>tabulas dati (1. rinda, 3. rinda)</td> </tr> <tr> <td>tabulas dati (2. rinda, 1. rinda)</td> <td>tabulas dati (2. rinda, 2. rinda)</td> <td>Tabulas dati (2. rinda, 3. kolonna)</td> </tr> CSS</table>:
tabula{robežu sabrukums:sabrukums; atstarpe starp robežām:0; apmale pa kreisi:1px ciets #888; border-top:1px solid #888; fons:#efefef; } th,td{border-right:1px solid #888; border-bottom:1px solid #888; polsterējums:5px 15px; } th{fonta svars:treknraksts; fons:#ccc; } |