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>Rozhození výšky řádku horním a dolním indexem</title> <h1>Rozhození výšky řádku horním a dolním indexem</h1> <div class="item"> <h2>Rozhozené řádky</h2> <p> Horní a dolní indexy pomocí značek <code><sup></code> a <code><sub></code> rozhodí<sup>1</sup> výšku řádku. Je potom jiná<sub>2</sub> než u řádků bez indexů. Použití entit <code>&sup2;</code>² nebo <code>&sup3;</code> ³ tím netrpí. </p> </div> <div class="item"> <h2><code>line-height: 0</code></h2> <p class="lh"> Horní a dolní indexy pomocí značek <code><sup></code> a <code><sub></code> rozhodí<sup>1</sup> výšku řádku. Je potom jiná<sub>2</sub> než u řádků bez indexů. Použití entit <code>&sup2;</code>² nebo <code>&sup3;</code> ³ tím netrpí. </p> </div> <div class="item"> <h2>Relativní posicování</h2> <p class="relative"> Horní a dolní indexy pomocí značek <code><sup></code> a <code><sub></code> rozhodí<sup>1</sup> výšku řádku. Je potom jiná<sub>2</sub> než u řádků bez indexů. Použití entit <code>&sup2;</code>² nebo <code>&sup3;</code> ³ tím netrpí. </p> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.item { max-width: 10em; margin: 1em; float: left; } .lh sup, .lh sub { line-height: 0; } .relative sub, .relative sup { vertical-align: baseline; position: relative; top: 0.4em } .relative sup {top: -0.4em}
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>