Bedingte Kommentare in HTML verwenden

Question

Ich bin relativ neu in der Webentwicklung und lerne ständig dazu. Kürzlich bin ich beim Betrachten von Quellcode für verschiedene Websites auf "bedingte Kommentare" gestoßen. Ich glaube, ich verstehe jetzt, was sie tun, bin aber unsicher, wann ich sie verwenden soll.

Ich habe gesehen, sie vor allem für die Implementierung verschiedener Stylesheets, wenn es darum geht, IE und würde gerne wissen, ob dies eine gute Praxis?

In diesem Fall lautet die Antwort "Ja". Ist es dann bei der Entwicklung einer Website "üblich", zwei separate Stylesheets zu verwenden, um Fehler zu beheben, z. B. ein Stylesheet für den IE und eines für Firefox, Opera usw. zu erstellen?

Vielen Dank im Voraus.

Answer 1

Soweit ich weiß, werden bedingte Kommentare nur vom IE unterstützt, und sie werden in Browsern, die sie nicht unterstützen, automatisch zurückgesetzt (da sie wie ein normaler Kommentar aussehen). Der allgemeine Konsens ist, dass es in Ordnung ist, ein nicht standardisiertes Browser-Feature zu verwenden, wenn man es benutzt, um ein anderes nicht standardisiertes Browser-"Feature" zu bekämpfen (d.h. die miserable Unterstützung für CSS im IE). Sie werden also feststellen, dass dies eine sehr häufige Lösung für die Optimierung von CSS ist.

Answer 2

Die Beschaffenheit des Internet Explorer (Version 6 insbesondere ) führt dazu, dass einige Stylesheets gut mit dem IE funktionieren, andere nicht. Für die Zwecke derjenigen, die nicht, können Sie bedingte Kommentare verwenden, um CSS-Code, der nur für IE angezeigt wird. Ich muss sie verwenden, weil der Internet Explorer CSS-Dropdown-Menüs (falsch) behandelt.

Um die Website, an der ich arbeite, richtig zu rendern, muss die hover Funktion des Dropdown-Menüs, muss ich die Datei crosshover.htc implementieren. Hier ist der Code, den ich verwenden muss:

     <!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {
behavior: url(http://www.stannscatholicschool.com/csshover.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}

#menu a, #menu h2 {
font: 100% verdana, tahoma, helvetica, arial, sans-serif;
}

</style>
<![endif]-->

Wenn ich das nicht tue, teilt sich das Dropdown-Menü auf und kann im Internet Explorer 6 nicht navigiert werden.

Answer 3

Ich habe bedingte Kommentare verwendet, um zu erkennen, ob die Besucher meiner Website IE6 oder niedriger verwenden. Wenn das der Fall ist, lade ich die IE7.js-Skript , das einige der Fehler in diesen älteren Browsern behebt. Es gibt auch ein Skript zur Emulation der IE8-Unterstützung.

Answer 4

Manche Leute verwenden Kommentare auch, um bestimmte Bereiche der Seite wie Fußzeile, Kopfzeile oder Hauptinhalt (oft in Vorlagen) zu umreißen.

Wenn Sie jedoch Divs und CSS verwenden (was bei Ihnen der Fall zu sein scheint), sollten Sie in der Lage sein, anhand der DIV-IDs und CSS-Stile zu erkennen, was der Inhalt ist oder in welchem Bereich der HTML-Datei Sie sich befinden. Denken Sie daran, klare Namen zu verwenden und versuchen Sie, sie nicht abzukürzen, nur um die Eingabe zu erleichtern.

Wenn das für Sie ein Problem ist, dann ist Intellisense eine wunderbare Sache und kann uns helfen, solche Dinge zu umgehen. Wenn nicht, dann ist CTRL+C und CTRL+V wahrscheinlich das Nächstbeste :)

Answer 5

Das ist eine großartige Übung! Die offizielle Dokumentationsseite der bedingten Kommentare enthält viele Beispiele und Kombinationen von bedingten Kommentaren, es lohnt sich, sie zu lesen. Die Seite besagt auch, dass:

Bedingte Kommentare erleichtern es Entwicklern, die erweiterten Funktionen von Microsoft Internet Explorer 5 und späteren Versionen zu nutzen und gleichzeitig Seiten zu schreiben, die in weniger leistungsfähigen Browsern korrekt angezeigt werden oder in anderen Browsern als Windows Internet Explorer korrekt angezeigt werden. Bedingte Kommentare sind das bevorzugte Mittel zur Unterscheidung von Cascading Style Sheets (CSS)-Regeln, die für bestimmte Versionen von Internet Explorer bestimmt sind.

Heutzutage ist der Internet Explorer der am wenigsten leistungsfähige Browser Sie werden also höchstwahrscheinlich bedingte Kommentare verwenden, um genau das Gegenteil zu erreichen, d. h. um die Vorteile der erweiterten Funktionen aller anderen Browser zu nutzen und gleichzeitig Seiten zu schreiben, die im Microsoft Internet Explorer problemlos heruntergestuft werden können.

Sie können bedingte Kommentare verwenden, um nicht unterstützte CSS-Stile zu korrigieren oder um Code vor dem Internet Explorer zu verbergen, wie hier:

<!--[if !IE]>-->
<script src="IE_will_never_see_this.js" type="text/javascript" charset="utf-8" ></script>
<!--<![endif]-->