Hoe OM - Responsiewe tabelle
Leer hoe om 'n responsiewe tabel te skep.
Responsiewe tabelle
'n Responsiewe tabel sal 'n horisontale rolbalk vertoon as die skerm te klein is om die volledige inhoud te vertoon. Verander die grootte van die blaaiervenster om die effek te sien:
Eerste naam | Van | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte | Punte |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Jill | Smith | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 |
Eva | Jackson | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 |
Adam | Johnson | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 |
Om 'n responsiewe tabel te skep, voeg 'n houerelement by met overflow-x:auto
rondom die <table>:
Voorbeeld
<div style="overflow-x:auto;">
<table>
...
</table>
</div>
Let wel: In OS X Lion (op Mac), word rolbalke by verstek versteek en slegs gewys wanneer dit gebruik word (al is "oorloop: blaai" of outomaties gestel).
Wenk: Gaan na ons CSS-tabelle-tutoriaal om meer te wete te kom oor hoe om tabelle te stileer.