márc29
A pozicionálási modellek utolsó áttekintő jegyzetében: az úsztatott(float-olt) modell és a relatív modell összekapcsolásáról lesz szó Ebben a modellben lehetséges az úsztatott elemek pozíciójának megváltoztatása anélkül, hogy ez bárminemű befolyást gyakorolna a többi elemre (beleértve az inline ill. az úsztatott elemeket), továbbá lehetséges az úsztatott elemet saját rétegzési kontextusba helyezni, ezáltal meghatározni az elhelyezkedését a z-tengely mentén. Lásd példafájlt.
tovább … »
márc24
Ahogy a nagy költő Horatius írta : in mediász rész, nézzük is mi is történik ilyenkor, az-az ha egy elemen a következő általános mintát alkalmazzuk
tovább … »
márc23
Saját rétegezési kontextusba akarsz helyezni egy float-olt vagy normális szövegfolyambeli elemet, vagy lehetséges legközelebbi pozicionált őssé akarod tenni, esetleg megakarod változtatni a pozícióját anélkül, hogy eltávolítanád a szövegfolyamból(ezzel megváltoztatva eredeti megjelenítését,formáját). Igen, akkor a te választásod a relatív pozicionálási modell lesz. (lehet, hogy ebben a stílusban kéne az egész lapot írni
)
tovább … »
márc22
Kezdjük is egyből a példafájl-on való kattintással, és egy kis lapgörgetéssel, láthatjuk, hogy a fix pozicionálású modellt használó elemek külön rétegbe kerültek és pozíciójuk a látótérhez képest rögzült (kivéve ie6 alatt ahol ez a modell nem elérhető, csak hatása reprodukálható egy kis nagy trüközéssel). Lássuk akkor ezen modell további tulajdonságait:
tovább … »
márc15
Az előző két bejegyzésben a rétegezési modell(static-context) és az elemi csoportok(atomic groups) fogalmának megismerésével megalapoztuk a pozicionált elemek konkrétabban az abszolút, relatív és a fix a pozicionálási modellek használatát. Ez a bejegyzés, ezek közül az elsővel: az abszolút pozicionálási modellel foglalkozik.
tovább … »
márc13
Nem mindig van szükség rétegezési kontextus létrehozására, néha elég atomi csoportokat létrehozni, hogy mik azok, ill. milyen problémát tudunk velük megoldani, erről szól ebben a bejegyzésben
tovább … »
márc10
végre sikerült egy pofásat kibányászni, nem 10perc volt
, dolgozom a bekonfigurálásán … , riszpekt mindenkinek aki sajátot használ
márc8
Avagy ki-hogy ismeri : rétegezési sorrend(stacking order), rétegezési szint (stacking level), z-index, rétegezés(layering), kirajzolási sorrend (painting order). HTML dokumentumok minden egyes eleméhez tartozik egy z-index, amely a dokumentumra merőleges z-tengelyen határozza meg egy adott elem pozícióját. Minta:
SELECTOR { z-index:±VALUE; position:ABSOLUTE_FIXED_RELATIVE; }
Ennek befolyásolásáról, meghatározásáról szól ez a jegyzet.
tovább … »
márc2
A statikus pozicionálási modell beállítása esetén az egyes elemek a normális szövegfolyamban (normal-flow) helyezkednek el, beállítani az position:static CSS tulajdonság megadásával tudjuk, általános minta:
Inline Statikus Elemen
INLINE-SELECTOR { position:static; line-height:±VALUE;
margin-left:±VALUE; margin-right:±VALUE; }
Blokk Statikus Elemen
BLOCK-SELECTOR { position:static; width:+VALUE; height:+VALUE;
margin-left:±VALUE; margin-right:±VALUE;
margin-top:±VALUE; margin-bottom:±VALUE; }
, de mivel az alapértelmezés is ez, erre nagyon nem lesz szükségünk. Tekintsük át mire is képes.
tovább … »
márc1
A CSS hat különböző pozicionálási modellt tartalmaz, használatukkal lehetséges: áthelyezni egy elemet minden tartalmazott elemével együtt, megváltoztatni egy elem pozícióját az őt tartalmazó elemhez, látótérhez(viewport) képest, lehetséges visszatenni egy elemet a saját rétegébe, illetve eltávolítani a szövegfolyamból (flow), vagy megváltoztatni a pozícióját a z-tengely mentén. Az előbbi kettőről lesz szó ebben a bejegyzésben, az utóbbiakat pedig a soron következőek fogják összefoglalni.
tovább … »