Práca s vlastnosťou display v CSS
Už viete, že všetky značky patria do určitého
blokového modelu. V prípade potreby však môžete
model zmeniť pomocou vlastnosti display.
Pomocou hodnoty block tejto vlastnosti
môžete prvok urobiť blokovým a pomocou
hodnoty inline - inline prvkom.
Urobme tak, aby sa značky span
správali ako blokové prvky:
<span>text</span>
<span>text</span>
<span>text</span>
span {
display: block;
width: 100px;
height: 100px;
border: 1px solid red;
margin-bottom: 20px;
}
:
A teraz urobme tak, aby sa značky div
správali ako inline prvky:
<div>text</div>
<div>text</div>
<div>text</div>
div {
display: inline;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Nech máte v HTML kóde niekoľko odsekov. Urobte tak, aby sa správali ako inline prvky.
Nech máte v HTML kóde niekoľko odkazov. Urobte tak, aby sa správali ako blokové prvky. Nastavte im ohraničenie, šírku a výšku.