Internet Explorer 10 (vagy újabb) specifikus CSS kód

Internet Explorer 10 (vagy újabb) specifikus CSS kód

Internet Explorer 10 (vagy újabb) specifikus CSS kód 658 230 Rottenbacher Tamás

A weboldal készítés során, többször a weblap készítő szembe találkozik a sokféle böngésző átkával. Míg felhasználói oldalról nagyon jó és örömteli, hogy sok böngésző program közül választhatunk, weblapos szemmel ez egyfajta átok. A legtöbb program azonosan értelmezi a html és css kódokat, de mindig vannak kivételek, amikor 1-1 apró kis elcsúszást vagy kilógást eredményezhet az eltérő programok kódolvasása, értelmezése. Mivel fontos egy minőségi weboldal esetében a kinézet, így az nem térhet el különféle böngészőkben. Ezt nevezik lényegében böngészőfüggetlen megjelenésnek. A korábbi évekig az Internet Explorer neve gyomorgörcsöt váltott ki a programozókból. Kínkeserves, kávétól átitatott, alvásra nem is gondoló esték teltek el a weblapok külsejének az IE böngészőkhöz való igazításával. Hála égnek, az IE 7 -es verziója óta javul folyamatosan az Internet Explorer kompatibilitása, szabvány követése. Az IE 11 -es verziója már egész jónak mondható ebből a szempontból, html5 kompatibilitásban igen elől jár. Azonban a belső motor változtatásával gondba kerültek a 10-es Internet Explorer -nél a weblapkészítők. Az IE -hez gyakorta szükséges úgynevezett specifikus css, vagy is olyan stílus kód, amit csak az IE értelmez. Korábban elég volt ilyen módon a kifejezetten IE -khez készült külön css-t meghívni az alábbi módon, melyet az alcím után láthattok.

Internet Explorer specfikus CSS IE9 -ig

<!--[if IE]>
	<link href="csakie.css" rel="stylesheet" type="text/css" />
<![endif]-->

A csakie.css-t csak az Internet Explorer böngészők értelmezték. Pontosabban csak az IE 1-9 közötti verziói. Korábbi években még annyira elterjedtek voltak a 6 -os és 7 -es IE verziók, hogy azokhoz is külön kellett készíteni css-t, mivel még olyan sokan használták. Mára már elenyésző lett az arányuk, nem éri meg a ráfordítást.

A fenti kód amúgy kiegészíthető és módosítható többféleképpen:

  • <!--[if IE 8]> = IE8 -as böngésző értelmezi csak, használható a 6, 7, 8, 9 -es verzióknál
  • <!--[if lt IE 8]> = IE7 -es vagy még régebbi, tehát IE8 – tól lefelé lévők, a szám természetesen módosítható igény szerint
  • <!--[if gte IE 8]> = IE8 -as és (elvileg az összes) újabb

 

Miért elvileg?

Az Internet Explorer motorját a 10 -es verzióban oly mértékben módosították, átírták, hogy már nem értelmezte ezen megkötéseket. A kérdés nagyon jó, hogy miért? Biztos meg tudták volna írni úgy is, de még sem tették. Persze az igény megmaradt, mert a 10 -es verzió sem tökéletesen.

Egy részhez IE spec kód

Lehetőség van erre is, ha csak egyetlen sorhoz szeretnénk IE -s külön értéket megadni:

.Class {
   color:  green;     /* alap, minden bongeszohoz */
   color:  green\9;   /* IE 8 es regebbi */
   *color: green;     /* IE 7 es regebbi */
   color:  green !ie; /* IE 7 es regebbi */
   _color: green;     /* IE 6 */
}

 

Internet Explorer specifikus CSS IE 10 -től

Természetesen van megoldás az IE 10 és az IE 11 -es verziójához is egyedi css -t megadni. Ehhez használjuk az alábbi kódsort, mellyel az „@import …” módon tudunk konkrét új css fájlt meghívni. Azonban mivel az új Internet Explorer verziók egyre jobb kompatibilitással bírnak, így jelentősen kevesebb specifikus kódrészletre van szükség, tehát a normál css fájl végére is fűzhetjük akár az igazításokat.

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
.cssosztaly { .... }
}

Ennyi az egész. A módszerrel jelenleg az IE 10, és 11 -es böngészőkhöz tudunk külön css-t hozzárendelni.

Rottenbacher Tamás

2006 óta foglalkozok weboldal készítéssel és 2007 óta keresőoptimalizációval. WordPress honlapokat 2008 óta készítek. Ha kérdezne írjon hozzászólást vagy email-t a "Kapcsolat" menüpontban.

Közösségi profiljaim:

Honlapunk cookie fájlokat használ, hogy jobb böngészési élményt biztosíthasson és forgalom mérést végezzen.