CSS Dateien für Explorer einbinden

Shake HandsBeim entwickeln einer Webseite stößt man immer wieder auf das Problem, das die Seite im Internet Explorer ganz unders aussieht als in allen anderen Browsern. Grund dafür ist, dass Microsoft sich bei der Umsetzung des HTML Codes nich sauber an die Standards der W3C hält. Die Tendenz zeigt aber das sich die Neueren Versionen des IE mehr und mehr daran halten. Der Druck der Entwicklergemeinde wurde Microsoft zu gross. Mit dazu trägt auch die Starke Konkurenz im Browsermarkt bei.

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="ie6-und-down.css" />
<![endif]-->


Anschließen habe ich mal ein Paar Browserweichen aufgezählt die Sie einsetzen können um spezielle Anpassungen für ie jeweilige Version vorzunehmen.

Hirr ein Beispiel wie Sie diese Weichen in Ihrem HTML Head Tag einbinden müssen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Titel der Webseite</title>

<link rel="stylesheet" type="text/css" href="normele.css" />

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="ie6-und-down.css" />
<![endif]-->

</head>
<body>
Ihr Inhalt der Webseite
</body>
</html>

Einbinden für alle IE Versionen

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/alle-ie.css" />
<![endif]-->

CSS Nicht bei IE einbinden

<!--[if !IE]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/kein-ie.css" />
<![endif]-->

CSS nur für IE 7

<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie7.css">
<![endif]-->

CSS nur für IE 6

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie6.css" />
<![endif]-->

CSS nur für IE 5

<!--[if IE 5]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie5.css" />
<![endif]-->

CSS nur für IE 5.5

<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie55.css" />
<![endif]-->

CSS nur für IE 6 und kleiner

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie6-und-down.css" />
<![endif]-->
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie6-und-down.css" />
<![endif]-->

CSS nur für IE 7 und kleiner

<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie7-und-down.css" />
<![endif]-->
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie7-und-down.css" />
<![endif]-->

CSS nur für IE 8 und kleiner

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie8-und-down.css" />
<![endif]-->
<!--[if lte IE 8]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie8-und-down.css" />
<![endif]-->

CSS nur für IE 6 und höher

<!--[if gt IE 5.5]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie6-und-up.css" />
<![endif]-->
<!--[if gte IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie6-und-up.css" />
<![endif]-->

CSS nur für IE 7 und höher

<!--[if gt IE 6]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie7-und-up.css" />
<![endif]-->
<!--[if gte IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie7-und-up.css" />
<![endif]-->

CSS nur für IE 8 und höher

<!--[if gt IE 7]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie8-und-up.css" />
<![endif]-->
<!--[if gte IE 8]>
<link rel="stylesheet" type="text/css" href="http://www.domain.de/ie8-und-up.css" />
<![endif]-->

Weiterführende Infos gibt es unter:

Christian

Phantasie ist wichtiger als Wissen.

You may also like...

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>