Tabulka v CSS aneb alternativa tagu TABLE pomocí DIV
Klasická tabulka s použitím tagu <table>, lze také jednoduchým způsobem vytvořit pouze za použití vhodně nastylovaného blokového elementu - v tomto případě pomocí tagu <div> :
#csstable {
width:300px;
border-top:1px solid #000;
border-left:1px solid #000;
}
#csstable div {
float:left;
width:91px;
padding:4px;
border-bottom:1px solid #000;
border-right:1px solid #000;
}
.title {
background:#FFCC00;
font-weight:bold;
}
.br {
clear:both;
}
Html kód je pak následující:
<div id="csstable">
<div class="title">Firstname</div>
<div class="title">Surname</div>
<div class="title">Age</div>
<div>Martin</div>
<div>Soukup</div>
<div>28</div>
<div>Petra</div>
<div>Dolinova</div>
<div>25</div>
<div>Eduard</div>
<div>Jelus</div>
<div>33</div>
<br class="br" />
</div>
Klasická tabulka se tedy dá řešit i alternativně za pomocí CSS - ukázka . Na zobrazování obsáhlejších dat je však toto řešení ne příliš vhodné a z hlediska sémantiky (X)HTML kódu je vhodné používat pro zobrazování dat klasickou tabulku.
Komentáře
Ahoj Martine!
Prosím, nefunguje odkaz na Ukázka CSS TABLE (link
Tež půlka članku je "neviditelná".
Děkuji Ti za zprovoznění.
Pavel
Článek Tabulka v CSS jsem inovoval a nyní by mělo vše fungovat bez problémů.
Ostatní články
- Nové produktové balíčky pro redakční systém (22.03.2009)
- Redesign www stránek (10.03.2008)
- Instalace APACHE, PHP a MySQL snadno a rychle! (08.03.2007)
- Tvorba internetových stránek pro obecní úřady a školy ZDARMA (29.01.2007)
- Komprimace JavaScriptu (18.07.2006)
- Tabulka v CSS aneb alternativa tagu TABLE pomocí DIV (18.10.2004)
- Google Desktop Search - beta (15.10.2004)
- PHP - Jak generovat PDF ? (13.10.2004)
- Návod jak instalovat APACHE, PHP a MySQL pod Windows ? (13.10.2004)
- PHP - DOM XML parser pro zpracování XML (12.10.2004)
Mohla by Vás zajímat i naše další služba:

