Darbas su display savybe CSS
Jūs jau žinote, kad visos žymos priklauso tam tikram
blokiniam modeliui. Norint, tačiau, galima
pakeisti modelį naudojant savybę display.
Naudojant šios savybės reikšmę block
elementą galima padaryti blokiniu, o naudojant
reikšmę inline - eilutiniu.
Padarykime, kad span žymos
elgtųsi kaip blokiniai elementai:
<span>text</span>
<span>text</span>
<span>text</span>
span {
display: block;
width: 100px;
height: 100px;
border: 1px solid red;
margin-bottom: 20px;
}
:
O dabar padarykime, kad div žymos
elgtųsi kaip eilutiniai:
<div>text</div>
<div>text</div>
<div>text</div>
div {
display: inline;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Tarkime, jūsų HTML kode yra keli pastraipos. Padarykite taip, kad jos elgtųsi kaip eilutiniai elementai.
Tarkime, jūsų HTML kode yra kelios nuorodos. Padarykite taip, kad jos elgtųsi kaip blokiniai elementai. Nustatykite joms sienelę, plotį ir aukštį.