Statikus helyzetmegadás (static)
Alapértelmezett. A HTML elem a szövegfolyamban az eredeti helyén marad. Helyzetét a HTML kódban elfoglalt helye határozza meg.
A HTML elemek közötti távolság a külső margók beállításával szabályozható.
A helyzetmegadás fajtájának beállítása:
kijelölő
{
position
:
static;
}
1. példa:
Forráskód
<style>
.tarolo { height:240px; width: 200px;
margin:5px; padding:0;
border:1px solid red;
background-color:yellow; color:blue;}
#Vizsgalt {position:static; height:100px;
background-color:#ff8888; color:#440000; }
#Elotte {position:static; background-color:#8888ff; height:40px; }
#Utana {position:static; background-color:#88ff88; height:40px; }
</style>
….
<body>
<div class="tarolo"> Tároló elem teteje
<div id="Elotte" >Előtte lévő elem tartalma... </div>
<div id="Vizsgalt"> Vizsgált elem tartalma... </div>
<div id="Utana" >Utána lévő elem tartalma...</div>
Tároló elem alja
</div>
</body>
Eredmény*
2. példa:
Forráskód
Változás az előzőhöz képest:
<style>
#Vizsgalt {margin: 20px; ....}
....
</style>
....
Eredmény*
* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_position_static_01.html