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
<title>Mřížka různě velkých obrázků s object-fit: contain</title> <h1>Mřížka různě velkých obrázků s <code>object-fit: contain</code></h1> <img src="/i/200x400"> <img src="/i/500x200"> <img src="/i/600x300"> <img src="/i/500x300"> <img src="/i/500x200"> <img src="/i/200x400"> <img src="/i/300x300"> <img src="/i/500x200"> <img src="/i/400x400"> <img src="/i/300x100"> <img src="/i/500x300">
HTML
Autoformát
Standardní režim
Mobilní zobrazení
img { float: left; height: 200px; width: 200px; object-fit: contain; -o-object-fit: contain; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>