wake-up-neo.com

Wie kann ich CSS nur für bestimmte festlegen? IE Browser?

Ich habe ein CSS/jQuery Checkbox-Skript: http://jsfiddle.net/BwaCD/

Das Problem ist, dass in aktuellen Browsern die Position der Eingabe absolut sein muss, damit die Spanne über der Eingabe schwebt. Aber in IE8 und darunter funktioniert das Skript nicht und daher verbleibt mir eine absolut positionierte Eingabe, die nur über anderen Elementen schwebt. Ich bitte nicht darum, dass das Skript in IE8 und darunter funktioniert.

Ich möchte wissen, wie ich mit CSS einen bestimmten Stil festlegen kann, wenn er IE8 oder niedriger ist. Ich denke, jQuery wäre akzeptabel, wenn es notwendig ist, aber ich denke nicht, dass es das ist. Ich weiß, dass dies nur mit CSS und HTML möglich ist. Ich weiß nur nicht, wie.

10
henryaaron
10
Adaz

Bedingte Kommentare würden funktionieren (<!--[if lte IE 8]><stylesheet><![endif]-->), aber wenn Sie alles im Stylesheet machen wollen, gibt es ist ein Weg :

body {  
    color: red; /* all browsers, of course */  
    color: green\9; /* IE only */  
}

Das Wichtigste hier ist der "\ 9", der genau "\ 9" sein muss. Ich weiß nicht genau, warum das so ist.

EDIT: Der\9-Hack reicht nicht aus. Um IE9 auszuschließen, benötigen Sie auch den :root hack :

:root body {
    color: red\9; /* IE9 only */  
}

Andere Browser außer IE unterstützen möglicherweise :root. Kombinieren Sie ihn mit dem\9-Hack, wenn Sie ihn als Ziel für IE9 verwenden.

15
Brilliand

Sie können die bedingten Kommentare von Internet Explorer verwenden, um dem HTML-Root-Tag Einen Klassennamen für ältere IE-Browser hinzuzufügen:

<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

Dann können Sie IE-spezifisches CSS definieren, indem Sie auf den entsprechenden Klassennamen wie folgt verweisen:

.ie8 body {
   /* Will apply only to IE8 */
}

Quelle: http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

3
Peter O.

http://code.tutsplus.com/tutorials/quick-tip-how-to-target-ie6-ie7-and-ie8-uniquely-mit-4-Zeichen--net-10575

am Beispiel: color : green\9;

\9 hat für ie11 nicht funktioniert, aber \0 hat funktioniert!

2
Tom Brito

ALLE VERSIONEN von IE anvisieren:

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

Ziel alles außer IE

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

Target IE 7 NUR

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

Ziel IE 6 NUR

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

Ziel IE 5 NUR

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

Ziel IE 5.5 NUR

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

Target IE 6 und LOWER

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

<!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

Target IE 7 und LOWER

<!--[if lt IE 8]>
    <link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->

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

Target IE 8 und LOWER

<!--[if lt IE 9]>
    <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->
<!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

Ziel IE 6 und HIGHER

<!--[if gt IE 5.5]>
    <link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->
<!--[if gte IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->

Ziel IE 7 und HIGHER

<!--[if gt IE 6]>
    <link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->
<!--[if gte IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->

Ziel IE 8 und HIGHER

<!--[if gt IE 7]>
    <link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->
<!--[if gte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->
2
Lucky

Ich habe eine nützliche Lösung für IE 10 und 11. Das Skript prüft, ob IE und die Version vorhanden ist, und fügt dem Tag die Klasse .ie10 oder .ie11 hinzu.

Auf diese Weise können Sie bestimmte Regeln wie .ie10 .something {} schreiben und werden nur angewendet, wenn der Browser IE 10 oder 11 ist.

Probieren Sie es aus, es ist nützlich für grazile Degradierung, wurde auf einigen kommerziellen Websites getestet und ist nicht wirklich hackig: http://marxo.me/target-ie-in-css

1
marxo

Ich habe auf diese Weise den Ziehcursor in Internet Explorer gelöst:

.grab_cursor {
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    cursor: url('../img/cursors/openhand.cur'), url('img/cursors/openhand.cur'), n-resize; /* standard: note the different path for the .cur file */
    cursor: url('img/cursors/openhand.cur'), n-resize\9; /* IE 8 and below */
    *cursor: url('img/cursors/openhand.cur'), n-resize; /* IE 7 and below */
    _cursor: url('img/cursors/openhand.cur'), n-resize; /* IE 6 */
}

Wenn in Internet Explorer für Windows bis einschließlich Version 8 ein relativer URI-Wert in einer externen Stylesheet-Datei angegeben ist, wird der Basis-URI als URI des Dokuments betrachtet, das die Element und nicht der URI des Stylesheets, in dem die Deklaration erscheint.

Dateibaum :

index.html
css/style.css -> here the posted code
img/cursors/openhand.cur

gute Referenzen :

0
Riccardo Volpe