Eienskap bottom
Die eienskap bottom spesifiseer die posisie
van die onderste rand van 'n element. Waardes vir die eienskap kan
geskryf word met algemeen aanvaarde maateenhede,
bv. in pixels, duim, punte, persentasies.
Die gespesifiseerde waardes kan ook negatiewe getalle wees,
in hierdie geval sal elemente oor mekaar geplaas word.
Die berekening van koördinate word bepaal deur die eienskap position,
wat gewoonlik die waarde relative
(relatiewe posisie) of absolute
(absoloute posisie) aanneem.
Sintaksis
selekteerder {
bottom: getal met 'n meeteenheid of auto;
}
Voorbeeld
Kom ons stel die posisie van die onderste rand
van die kindelement gelyk aan 25px
wanneer daar daaroor gehover word:
<div id="elem">
<p></p>
</div>
#elem {
width: 400px;
height: 300px;
border: 1px solid black;
}
p {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
margin-top: 50px;
}
p:hover {
bottom: 25px;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Voorbeeld
En laat ons nou die onderste rand
van die kindelement plaas
op -50px wanneer daar daaroor gehover word:
<div id="elem">
<p></p>
</div>
#elem {
width: 400px;
height: 300px;
border: 1px solid black;
}
p {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
margin-top: 50px;
}
p:hover {
bottom: -50px;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Sien ook
-
die eienskap
top,
wat die posisie van die boonste rand van 'n element spesifiseer -
die eienskap
left,
wat die posisie van die linkerrand van 'n element spesifiseer -
die eienskap
right,
wat die posisie van die regterrand van 'n element spesifiseer -
die pseudoelement
::backdrop,
wat die plasing na die eerste element spesifiseer -
die eienskap
caption-side,
wat die posisie van 'n tabelblyskrif spesifiseer