Pro výukové účely na SPŠ Zlín
vytvořil RNDr.Vladimír Vaščák

CSS

12. Vlastnosti zobrazení

vlastnost display

Změní původní nastaví zobrazení prvku .
Hodnoty jsou: block (blok, prvek se zobrazí s řádkovým zlomem na konci), inline (řádek, prvek se zobrazí s bez řádkovýho zlomu na konci), list-item (položka seznamu) a none (prvek se nezobrazí).

Příklad:
<a class="blok" href="http://www.jakpsatweb.cz/" target="_blank">http://www.jakpsatweb.cz/</a><a class="blok" href="http://interval.cz/" target="_blank">http://interval.cz/</a><a class="blok" href="http://www.kosek.cz" target="_blank">http://www.kosek.cz</a><a class="blok" href="http://www.sovavsiti.cz" target="_blank">http://www.sovavsiti.cz</a><a class="blok" href="http://www.tvorba-webu.cz/" target="_blank">http://www.tvorba-webu.cz/</a>

Se zalomí do bloku:
http://www.jakpsatweb.cz/http://interval.cz/http://www.kosek.cz http://www.sovavsiti.cz http://www.tvorba-webu.cz/

Bez změny zobrazení:

<p class="vradku" >1. odstavec</p> 
<p class="vradku" >2. odstavec</p>

Se nezalomí do bloku:

1. odstavec

2. odstavec

Zajímavé nastavení je:
display: none
Tímto prvek úplně skryjete.
Poznámka: visibility: hidden pouze zneviditelní.

Příklad:
.neni {display: none}
začátek <span class="neni">Toto tu není</span> konec
začátek Toto tu není konec

.nevidim {visibility: hidden}
začátek <span class="nevidim>Toto tu je, ale nevidíte</span> konec
začátek Toto tu je, ale nevidíte konec

vlastnost white-space

Definuje způsob práce prohlížeč s "bílými znaky" (mezer, tabulátory a CR).
Povolené hodnoty jsou normal (kde je potřeba, zalomí se řádek), pre (řádky se lámou pouze tam, kde ve zdroji) a nowrap (text bude na jednom řádku).

zpět