Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<div class="zbozi"> <table> <thead> <tr> <th>Zboží</th> <th>Ks</th> <th>Cena/Ks</th> <th>Celkem</th> </tr> </thead> <tbody> <tr> <td class="oddelovac" colspan="4"></td> </tr> <tr> <td>Položka</td> <td>1</td> <td>100 Kč</td> <td>100 Kč</td> </tr> <tr> <td>Položka</td> <td>2</td> <td>100 Kč</td> <td>200 Kč</td> </tr> </tbody> <tfoot> <tr> <td><label><input type="checkbox"> Souhlas s podmínkami</label></td> <td></td> <td> Cena bez DPH:<br> DPH:<br> Cena s DPH: </td> <td> 100 Kč<br> 20 Kč<br> 120 kč </td> </tr> </tfoot> </table> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.zbozi { border: 1px solid #ccc; display: table; padding: 0 .5em; } .zbozi table { border-spacing: 0 .5em; } .zbozi th { background: #ccc; } .zbozi td, .zbozi th { padding: 1em; } .zbozi tbody td { border: 1px solid #ccc; border-right: 0; border-left: 0; } .zbozi tbody td:first-child { border-left: 1px solid #ccc; } .zbozi tbody td+td+td+td { border-right: 1px solid #ccc; } .zbozi thead th { outline: .5em solid #ccc; text-align: left; padding: 0 1em; } .zbozi .oddelovac:first-child {border: 0; padding: 0;}
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>