Stílusváltás

2010.05.06. 13:13

Lassan lassan az IE is beáll a szabványos böngészők sorába. Igaz, mindíg egy lépéssel lemaradva követi a trendet, de ahogy beérnek a szabványok úgy az az egy lépés egyre kevésbbé fog számítani.
 

Ennek egyik előnye, hogy nem 2-3 hanem csak egyetlen weboldalt kell programoznunk. Nem elhanyagolható következmény azonban az sem, hogy ahogyan túlléptünk a tradicionális <table> és <frame> alapú honlapokon, most már a <div>-ben <div> struktúrákra sincs szükség, hogy egyben maradon a tartalom.

A tisztuló markup, melynek köszönhetően az adat és a tartalom végleg szétválik, megnyitja a lehetőségét a stíluslapok közti szabad váltásnak. Arra azonban ügyelni kell, hogy hogyan választjuk meg a CSS osztályokat! Sajnos a CSS nem támogatja az öröklődést a szó objektum orientált értelmében, pedig most nagyobb szükség van rá, mint bármikor.

Vegyük az alábbi egyszerű esetet:

<div class="centered funny_border">

Látszólag a fejlesztő szétválasztotta a megjelenítést és a tartalmat: a formázási információ átkerült a CSS definíciók közé. De valójában a formázási utasítások még mindig benne vannak a kódban! A div osztálya azt mondja: igazíts középre és adj nekem vicces keretet. Pedig azt kéne mondania, hogy "én egy vicces doboz vagyok":

<div class="joke_box">

És ezen a ponton kezdenek el hiányozni a CSS objektum orientált tulajdonságai, aminek következtében a stíluslap tele lesz ismétlésekkel. Például ha a designer ugyanazt a keretet szánta a vicc-dobozoknak, mint a hozzászólásoknak, csak előbbit középre rendezte, utóbbi pedig egy színsémát kapott, akkor a keretet két helyen kell definiálnia.

div.joke_box {
   .... /* Mindenféle vicc-doboz tulajdonság*/
   border: .......;/* Egy vicces keret nagyon sok tulajdonságból állhat, és a CSS3-mal etz csak bővül majd*/
}
div.comment {
   .... /* Mindenféle hozzászólás tulajdonság*/
   border:........; /* A fenti keret pontos másolata, minden időben. Brrrr......*/
}


Megoldást jelenthet, ha a keretre jellemző tulajdonságokat kiemeljük:

div.comment, div.joke_box {
   border:........; /* Így már nem kell másolgatni */
}

De ekkor azt lesz gondunk számon tartani, hogy hány helyre is szóródott szét a joke_box definíciója. Milyen szép lenne a joke_box-on belül hivatkozni néhány másik stílusra, majd igény szerint kiegészíteni, valahogy így:

div.joke_box {
   @import funny_border;/* Lehet, hogy azt sem kellene kikötni, hogy csak div-ek közt lehessen megosztani stílusokat? */
   .... /* Mindenféle vicc-doboz specifikus tulajdonság*/
}

Remélem nem sokára nem csak a lapok szintjén lesz kaszkádosítás, illetőleg az általánostól a specifikusig haladva, hanem tetszőlegesen definiált sorrendben.

A bejegyzés trackback címe:

https://lapozgatas.blog.hu/api/trackback/id/tr831978904

Kommentek:

A hozzászólások a vonatkozó jogszabályok  értelmében felhasználói tartalomnak minősülnek, értük a szolgáltatás technikai  üzemeltetője semmilyen felelősséget nem vállal, azokat nem ellenőrzi. Kifogás esetén forduljon a blog szerkesztőjéhez. Részletek a  Felhasználási feltételekben és az adatvédelmi tájékoztatóban.

Nincsenek hozzászólások.
süti beállítások módosítása