Sifa top

Sifa top inaweka msimamo wa ukingo wa juu wa kipengele kutoka juu ya kipengele cha mzazi. Thamani za sifa zinaweza kuandikwa kwa vitengo vya kawaida vya ukubwa, kwa mfano, kwenye saizi, inchi, pointi, asilimia. Thamani zilizowekwa zinaweza kuwa namba hasi, katika kesi hii vipengele vitakaa juu ya kila mmoja. Hesabu ya kuratibu imedhamiriwa na sifa position, ambayo kwa kawaida huchukua thamani relative (msimamo wa jamaa) au absolute (msimamo kamili).

Syntax

csskichaguli {
  top: ukubwa au auto;
}

Mfano

Wacha tukielekeza kwenye kipengele cha mtoto tuweke msimamo wake wa mpaka wa juu sawa na 25px:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-top: 50px;
  margin-left: 50px;
}
p:hover {
  top: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Mfano

Sasa wacha mpaka wa juu wa kipengele cha mtoto uweko kwenye -50px:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  margin-top: 50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-left: 50px;
}
p:hover {
  top: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Angalia pia