For at nettleseren skal plukke den CSS-en som er lagd for den - kun den - må vi bruke @import. Dette er en veldig undervurdert kommando fordi man slipper å gjøre komprimisser for at designet skal vises nogenlunde korrekt i alle browsere.
Vi trenger følgende: stilark/stil.css, stilark/import.css og stilark/style.css.
I <head> setter vi:
<link href="stilark/stil.css" rel="stylesheet" type="text/css" />
<link href="stilark/import.css" rel="stylesheet" type="text/css" />
I stilark/stil.css setter du "standard" designet. Her tar du utgangspunkt i en browser, f.eks. IE og lager siden slik du vil ha den.
I stilark/import.css legger vi til @import url("style.css") all;. Nå vil alle browsere utenom IE forstå hva som står i import.css, og IE vil derfor bare droppe den. Ingen skade skjedd for IE.
Firefox, Opera og andre brukebare browsere derimot forstår denne kommandoen og gjør som den sier; inkulderer style.css.
Fordi import.css kommer etter stil.css vil nettleseren tolke det som at style.css skal inkluderes etter stil.css. Et element som er plassert helt nederst vil overstyre det samme elementet plassert over den.
Eksempel:
p { border: 1px solid #000000; }
blir overstyrt av
p { border: 3px solid #00FF00; }
fordi den er plassert lengre nede i stilarket.
Nå kan vi overstyre hva vi vil - vi kan til og med bytte ut dårlige GIF-bilder med PNG.
På http://imfo.ru/csstest/css_hacks/import.php finner du mange flere hacks for å inkludere forskjellige stilark.
Vi trenger følgende: stilark/stil.css, stilark/import.css og stilark/style.css.
I <head> setter vi:
<link href="stilark/stil.css" rel="stylesheet" type="text/css" />
<link href="stilark/import.css" rel="stylesheet" type="text/css" />
I stilark/stil.css setter du "standard" designet. Her tar du utgangspunkt i en browser, f.eks. IE og lager siden slik du vil ha den.
I stilark/import.css legger vi til @import url("style.css") all;. Nå vil alle browsere utenom IE forstå hva som står i import.css, og IE vil derfor bare droppe den. Ingen skade skjedd for IE.
Firefox, Opera og andre brukebare browsere derimot forstår denne kommandoen og gjør som den sier; inkulderer style.css.
Fordi import.css kommer etter stil.css vil nettleseren tolke det som at style.css skal inkluderes etter stil.css. Et element som er plassert helt nederst vil overstyre det samme elementet plassert over den.
Eksempel:
p { border: 1px solid #000000; }
blir overstyrt av
p { border: 3px solid #00FF00; }
fordi den er plassert lengre nede i stilarket.
Nå kan vi overstyre hva vi vil - vi kan til og med bytte ut dårlige GIF-bilder med PNG.
På http://imfo.ru/csstest/css_hacks/import.php finner du mange flere hacks for å inkludere forskjellige stilark.