×
COOKIES
Prezeraním tejto stránky dochádza k spracovaniu cookies. Spracovaniu cookies zabránite v nastaveniach internetového prehliadača alebo nezobrazovaním tejto stránky v internetovom prehliadači.
Technologický web Mateja Lednára
Spoznávajte svet technológií

Ako správne aplikovať vlastnosť clear (CSS)

Pri práci s obtekaním prostredníctvom vlastnosti float môže vývojár naraziť na problém so zrušením obtekania prostredníctvom vlastnosti clear. V tomto článku budú predstavené dva spôsoby, ktoré ignorujú zrušenie obtekania prostredníctvom vlastnosti clear.
Pre demonštrovanie problémov so zrušením obtekania je použitý HTML atribút style. V praxi je potrebné sa inline štýlom vyhýbať a používať šablóny s jazykom CSS a HTML atribút class namiesto style.
Prvý spôsob, ktorý znefunkční zápis pre zrušenie obtekania, je aplikovanie vlastnosti clear na riadkový element (napr. element <span>).
Príklad: Ignorovanie vlastnosti clear v riadkovom elemente <span>.
1
2
3
4
<div style="float : left;">Node 1 </div>
<div style="float : left;">Node 2 </div>
<span style="clear : left;"></span>
<div>Node 3 </div>
Z tohto dôvodu je nutné, aby vlastnosť clear bola aplikovaná na blokové elementy (napr. element <div>).
Príklad: Aplikovanie vlastnosti clear prostredníctvom blokového elementu <div>.
1
2
3
4
<div style="float : left;">Node 1 </div>
<div style="float : left;">Node 2 </div>
<div style="clear : left;"></div>
<div>Node 3 </div>
Druhý spôsob, ktorý znefunkční zápis pre zrušenie obtekania, je aplikovanie vlastnosti clear spolu s vlastnosťou display, konkrétne display:none. Zápis display:none pritom môže byť aj v blokovom elemente.
Príklad: Ignorovanie vlastnosti clear prostredníctvom vlastnosti display.
1
2
3
4
<div style="float : left;">Node 1 </div>
<div style="float : left;">Node 2 </div>
<div style="clear : left; display: none;"></div>
<div>Node 3 </div>
Vyvarovaním sa uvedených zápisov je možné predísť problémov pri tvorbe rozloženia elementov v dokumente HTML.

Záver

Pri rušení obtekania je potrebné vlastnosť clear umiestniť do blokového elementu. Blokový element nesmie obsahovať zápis display:none. V prípade, že poznáte ďalšie často používané zápisy, ktoré ignorujú použitie vlastnosti clear, a teda aj zrušenie obtekania, podeľte sa o ne prostredníctvom komentára.
CSS,programovanie,HTML,clear,display,float,div,span,blokový element,riadkový element
Žiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.
Viac informácií nájdete v sekcii O projekte.

Komentáre

Článok neobsahuje zatiaľ žiadne komentáre.

Pridať komentár

Meno (povinné)
Web
Správa (povinné)
Odoslať
Od najnovších