Böngészőfüggetlen CSS

A következő leírásból megtudhatod, hogyan készíts olyan honlapot, amit minden böngésző biztosan ugyanúgy jelenít meg. Persze ez arra az esetre vonatkozik, ha a lapon lévő formázásokat CSS-ből adod meg.
Az alábbi kódot másold be a *.php dokumentum fejlécébe (HEAD). A lapnak *.php kiterjesztésűnek kell lennie, és a szerverednek tudnia kell futtatni php scripteket.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<?php
if ($name = strstr ($HTTP_USER_AGENT, "MSIE")) 
{ 
?>
<link rel="stylesheet" href="internet-explorer-stylesheet.css">
<?php
} 
else if ($name = strstr ($HTTP_USER_AGENT, "Netscape")) 
{ 
?>
<link rel="stylesheet" href="netscape-stylesheet.css">
<?php
} 
else
{ 
?>
<link rel="stylesheet" href="other-stylesheet.css">
<?php
} 
?>
Hugyecz Görgy (Harder)
Hugyecz Görgy (Harder)
http://blog.harder.hu
20+ éve munkám és hobbim is az online világhoz köt. Az utóbbi 10+ évben leginkább keresőopimalizálás (SEO) témában tevékenykedem, mellette pedig Google Ads és Facebook PPC fronton is segítem ügyfeleimet. Korábban 10+ évig webgrafika, sitebuild, weboldal készítés témakörben mozogtam.
Facebook Linkedin

KAPCSOLÓDÓ CIKKEKTÖBB A SZERZŐTŐL

11 HOZZÁSZÓLÁS 

  3. 1
2
3
4
5
6
7
8

    <?
if ($name = strstr ($HTTP_USER_AGENT, "MSIE")) 
     print ('');
else if ($name = strstr ($HTTP_USER_AGENT, "Netscape")) 
     print ('');
else 
print ('');
?>

  5. Hát, Lehet, hogy nektek ez baromira egyszerű, de szerintem nem csak annyi az egész, hogy bemásolom és kész!
    Úgy látom másnak sem működik.
    Nincs olyan megoldás ami tényleg megoldja ezt a problémát és mondjuk normálisan el van magyarázva a „hülyéknek” is, hogy hogyan kell alkalmazni?

  6. Úgy kell alkalmazni, ahogy le van írva, ezt nagyon másképp nem lehet elmagyarázni szerintem de azért megpróbálom. Van egy „php” kiterjesztésű fájlod, pl. index.php. Ez a honlapod kezdő lapja. Ennek a forrásába bemásolod még a head részbe a fenti PHP kódot és elmented.
    A head része a dokumentumnak ott ér véget, ahol ezt látod:

    1

    </head>

    A PHP kódban lévő CSS fájlnevek helyére beírod azt, amiket te használsz. Nagyjából ennyi.

    Viszont:

    Már a címet sem értem hogy miért választottam, hisz pont arról szó, hogy böngészőfüggő CSS-t akarunk megjeleníteni a látogatónak.
    Fogalmam sincs hogy anno ezt a cikket miért tartottam jó megoldásnak, van erre más módszer is ami nem PHP függő, kevesebb kódot kell hozzá írni, biztosan működik, mégpedig a conditional comments használata.

    Ehhez leírást itt találsz a lapon: Böngészőfüggő CSS – feltételek segítségével

    Egyetlen hátránya hogy pl. netscape-hez már nem lehet vele külön css-t behúzni, de manapság úgyis max az IE miatt kell ezt a megoldást használni, úgyhogy …

  7. Kösz a gyors választ!

    (Azt tudom, hogy mi a Azt tudom, hogy mi a „head”)
    Tehát akkor azt jelenti, hogy vagy külön meg csinálom IE-re és FF-ra a css-t és azokat hívom be a fenti módon, vagy minden DIV-hez (ahol szükséges) külön értékeket adok meg a css-ben IE hekkel.
    Asz’ittem van egyszerűbb megoldás.
    Ja és ez nem elég, mert amin most dolgozok, már Operában sem azt mutatja amit FF-ban letesztelek.

  8. Lekli Szabolcs: nem kell teljesen külön megcsinálni az egész CSS-t minden böngészőre, hisz jóesetben (*) csak alig 1-2 sort kell felvenned az IE-hez tartozó CSS-ben.

    Operára is van megoldás (cikkre keress rá itt a lapon), de az már régen rossz, ha ennyire másképp jelenik meg minden böngésző alatt a lapod.

    (*): az ideális megoldás az lenne, ha 1db CSS-sel, hack-ek nélkül tudod megvalósítani azt, hogy a lapod minden böngésző alatt jól jelenjen meg. Erre törekedj inkább, ezt tanuld meg. Meg lehet csinálni.

  9. Kösz Harder!

    Úgy néz ki, tényleg csak néhány hack kell a „margin” és a „width” értékekhez, hogy IE-ben is ugyanúgy nézzen ki.
    Igazából nem értem mi történt tegnap amikor megnéztem Operában is a készülő lapot? Akkor szétcsúszott, most tökéletes. /FF alatt tesztelem/

  10. Lekli Szabolcs: ennek örülök. :) Az üzeneted többi részét moderáltam, mert nem a cikkhez tartozik és nem akarom hogy tele legyen más jellegű problémával ez a téma.
    A fórumon segítséget tudsz kérni azügyben, de inkább a lapot mutasd majd meg és írd le mi a gond, mert 1-1 kis css részlet alapján nem igen lehet segíteni.

  11. Tényleg unom a táblázatokat, tényleg unom a különböző böngészőket, tényleg szeretnék valami stílust! Az elinduláshoz kellene (sok) segítség. A honlap részlete, ami nagyon gusztustalanul néz ki:
    http://szoroban.com/1learning/2gyakvtn1.htm
    A kis mozgó izének egyben kellene lennie, most JAVA és Flash kombináció, de ha tudtok rendes megoldást, megköszönöm! A kis eszközöcske külön ablakban történő futtatását nem biztos, hogy mindenütt megfelelőnek kell ítélni, de ha nincs más, akkor jöhet: http://szoroban.hu/1learning/001/3tengelyes.html
    Ha valaki teszteli pár böngészőben a fenti linkeket, meglátja az eredményt.
    Nem azt várom, hogy helyettem bepötyögje valaki, de elindulni segítsetek!
    Köszi!
    Józsi!

HOZZÁSZÓLOK A CIKKHEZ

Kérjük, írja be véleményét!
írja be ide nevét