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
<details> <summary>Položka</summary> <p>Obsah položky, který se objeví až po rozkliknutí.</p> <details> <summary>Druhá položka</summary> <p>Obsah položky 2</p> <details open> <p>Položka bez <code><summary></code> bude mít nějaký výchozí popisek jako <i>Podrobnosti</i> apod.</p> </details> </details> <details> <summary>Položka může být i prázdná</summary> </details> <details> <details> <details> <details></details> </details> </details> </details> </details>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
/* rozklikávací popisek */ summary { cursor: pointer; } /* rozkliknutý popisek */ details[open] > summary { font-weight: bold; } /* ikonka znázorňující rozbalení */ summary::-webkit-details-marker { color: red; } summary:focus { outline: 0; } details p { margin: .5em 1em; } details details { margin-left: 1em; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>