Hvordan man... hvordan virker... hvordan kan...

Ordforklaring

gt:

 greater than

gte:

 greater than or equal

lt:

 less than

lte:

 less than or equal

!:

 not / ikke

IE:

 Internet Explorer

Hvordan bruger man conditional comments til CSS i Internet Explorer?


Conditional comments bruger man i IE til at give Microsofts browser særlige instruktioner om hvordan hjemmesiden skal vises. Det er nødvendigt fordi Microsofts mange versioner af Internet Explorer-browseren ikke følger de gængse webstandarder lige så tæt som Firefox, Chrome, Safari og Opera.

En conditional comment kan sættes hvor som helst i et HTML-dokument og indholdet af den vises så kun i den eller de versioner af IE som defineres.

 

Eksempelvis i <head> til at angive et CSS stylesheet:

<!--[if lt IE 9]>
<link type="text/css" rel="Stylesheet" media="all" href="/css3/hvordan_ie.css">
<![endif]-->

Eller conditional comments i <body> til at angive indhold i HTML:

<!--[if IE 6]>
  <p>Hej, jeg er Internet Explorer 6. Enhver webprogrammørs værste mareridt.</p>
<![endif]-->

 Det er meget sjældent at man ser conditional comments brugt i selve HTML-indholdet af en hjemmeside, men conditional comments er en af de nemmeste måder at servere specifikke CSS (stylesheets) til de fejlbefængte Microsoft-browsere.

 

Conditional comments IE10 - Windows 8

Microsoft er så sikre på at Internet Explorer 10 (IE10) overholder webstandarderne, at der ikke findes en conditional comment som læses af IE10.

 

Det vil sige at CSS og HTML som er indesluttet af <!-- [if !IE]> rent faktisk bliver læst af IE10. Samtidigt læser IE10 stadig noget af den proprietære CSS som kun IE-browsere forstår.

 

Det giver naturligvis en del kompabilitetsproblemer, og virksomhederne må nok berede sig på at betale deres webudviklere en mindre sum penge for at få ryddet op i redeligheden så deres hjemmesider ser fornuftige ud i fremtidens formodentlig mest udbredte browser.

 

Liste over conditional comments 

Hvis du vil teste hvordan conditional comments virker, så kopiér nedenstående koder ind i <body>-delen af dit HTML-dokument og test siden i forskellige browsere.

<!--[if IE]>
  Du ser mig, hvis du bruger Internet Explorer<br>
<![endif]-->
<!--[if IE 6]>
  Du ser mig, hvis du bruger IE 6<br>
<![endif]-->
<!--[if IE 7]>
  Du ser mig, hvis du bruger IE 7<br>
<![endif]-->
<!--[if IE 8]>
  Du ser mig, hvis du bruger IE 8<br>
<![endif]-->
<!--[if IE 9]>
  Du ser mig, hvis du bruger IE 9<br>
<![endif]-->
<!--[if gt IE 6]>
  Du ser mig, hvis du bruger større end IE 6<br>
<![endif]-->
<!--[if gte IE 7]>
  Du ser mig, hvis du bruger IE 7 eller større<br>
<![endif]-->
<!--[if lt IE 8]>
  Du ser mig, hvis du bruger mindre end IE 8<br>
<![endif]-->
<!--[if lte IE 9]>
  Du ser mig, hvis du bruger IE 9 eller mindre<br>
<![endif]-->
<!--[if !IE]> -->
  Du ser mig, hvis du bruger en rigtig browser<br>
<!-- <![endif]-->

HTML, CSS, hjemmeside, internet - Hvordan.dk -