X

Aleproste na FaceBook'u

Reklama.

[HTML] [CSS] Sterowanie wykonywaniem kodu dla IE :: HAKI IE

Tylko dla przeglądarki IE Microsoftu!

Kod warunkowy (nazywany też komentarzami warunkowymi lub hakami IE, pewnie z powodu specyficznej budowy), interpretowany jest tylko przez przeglądarki IE. Dla pozostałych przeglądarek stanowi on typowy komentarz w kodzie HTML.

Jak wygląda kod warunkowy?

<!--[if IE]> kod interpretowany tylko przez IE <![endif]-->
...

Zasada działania takiego zapisu jest taka, że kod zawarty wewnątrz znaczników kodu warunkowego [if IE] jest pomijany przez przeglądarkę IE, która nie spełnia warunku [ if ].

Powyższy kod dopuszcza stosowanie dodatkowych parametrów, które określają dokładniej wersję IE, np:

...
 <!--[if IE 5.0]> kod interpretowany tylko przez IE 5.0 <![endif]-->
 <!--[if IE 5.5]> kod interpretowany tylko przez IE 5.5 <![endif]-->
 <!--[if IE 6.0]> kod interpretowany tylko przez IE 6.0 <![endif]-->
 ...

i tak dalej ...

Dodatkowo warunek [ if ]  dopuszcza stosowanie następujących operatorów logicznych:

gt  - większa niż
 gte - większa lub równa
 lt  - mniejsza
 lte - mniejsza lub równa
 !   - nierówna

Przykład:

...
 <!--[if gt IE 6.0]> kod interpretowany tylko przez IE w wersji większej niż 6.0 <![endif]-->
 <!--[if !IE 7.0]> kod interpretowany tylko przez IE w wersji innej niż 7.0 <![endif]-->
...

UWAGA! Kod warunkowy możemy umieścić tylko w HTML'u!.

Głównym sposobem wykorzystania kodu warunkowego jest włączanie odpowiednich dla danej wersji IE arkuszy stylów CSS lub bezpośrednio definicji stylów, np.

<!--[if !IE 7.0]> 
  <style type="text/css">
   .klasa {position: absolute; ... }
  </style>
 <![endif]-->
 ...
 <!--[if IE 7.0]> 
  <style type="text/css">
   .klasa {position: fixed; ... }
  </style>
 <![endif]-->

Dołączanie zewnętrznego arkusza stylów CSS:

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

Uwaga! - arkusze stylów i style CSS zawarte w znacznikach kodu warunkowego, są pomijane przez walidatory.

opublikowane 11-03-2010177510 powrót

© aleproste.pl v.10 Projekt i realizacja projekt.etvn.pl & aleproste.pl