Eine detaillierte Einführung in die Verwendung von Blockkommentaren in HTML

Eine detaillierte Einführung in die Verwendung von Blockkommentaren in HTML
Allgemeine Kommentare in HTML: <!--XXXXXXXX-->, wobei XXXXXXXX der Kommentarinhalt ist

Blockkommentar-CSS in HTML <!--[if IE]>….<![endif]--> (<!--[if !IE]>||<![endif]

Code kopieren
Der Code lautet wie folgt:

1. <!--[if !IE]><!--> Erkennbar außer IE<!--<![endif]-->
2. <!--[if IE]> Alle IE erkennen <![endif]-->
3. <!--[if IE 5.0]> Nur IE5.0 erkennt <![endif]-->
4. <!--[if IE 5]> Nur IE5.0 und IE5.5 erkennen <![endif]-->
5. <!--[if gt IE 5.0]> IE5.0 und höher erkennen <![endif]-->
6. <!--[if IE 6]> Nur IE6 erkennt <![endif]-->
7. <!--[if lt IE 6]> IE6 und niedrigere Versionen erkennen <![endif]-->
8. <!--[if gte IE 6]> IE6 und höhere Versionen erkennen <![endif]-->
9. <!--[if IE 7]> Nur IE7 erkennt <![endif]-->
10. <!--[if lt IE 7]> IE7 und niedrigere Versionen erkennen <![endif]-->
11. <!--[if gte IE 7]> IE7 und höhere Versionen erkennen <![endif]-->
<!--[if lte IE 6]>……<![endif]-->

Ite: kleiner oder gleich bedeutet kleiner oder gleich wie der IE6-Browser, wird für bedingte Kommentare des IE-Browsers verwendet, wird häufig in CSShack, JS für IE usw. verwendet.

Beim Erlernen und Anwenden von WEB-Standard-Webseiten ist die Kompatibilität von Webseiten mit Browsern ein Problem, auf das wir häufig stoßen. Unter ihnen nimmt der Internet Explorer (kurz IE) von Microsoft den größten Teil des Browsermarktes ein, daneben gibt es auch Firefox, Opera usw. Kompatibilität mit diesen Browsern ist erforderlich.
Gleichzeitig verwenden die aktuellen Browser, was den IE betrifft, aufgrund der Aktualisierung und Ersetzung der IE-Versionen hauptsächlich die drei Versionen IE5 (IE5.5), IE6 und IE7. Diese drei Versionen weisen jedoch unterschiedliche Interpretationen und Ausführungen der von uns erstellten WEB-Standard-Webseiten (XHTML+CSS) auf. Außerdem interpretieren andere Nicht-IE-Browser einige CSS anders als der IE. Daher können die dedizierten bedingten Kommentare im IE-Browser verwendet werden, um relevante Attribute gezielt zu definieren.
Bedingte Kommentare können nur im Windows Explorer 5+ (im Folgenden als IE bezeichnet) verwendet werden (bedingte Kommentare werden ab IE5 unterstützt). Wenn Sie mehrere IE-Versionen installiert haben, basieren bedingte Kommentare auf der höchsten IE-Version (derzeit IE 7).

Bedingte Kommentare können nur im Windows Internet Explorer (im Folgenden als IE bezeichnet) verwendet werden. Daher können wir bedingte Kommentare verwenden, um spezielle Anweisungen für den IE hinzuzufügen.
Vereinfacht ausgedrückt handelt es sich bei bedingten Kommentaren um if-Urteile, die allerdings nicht im Skript, sondern direkt im HTML-Code ausgeführt werden, zum Beispiel:
<!--[wenn IE]>
Hier ist der normale HTML-Code
<![endif]-->
1. Die Grundstruktur bedingter Kommentare ist dieselbe wie bei HTML-Kommentaren (<!-- -->). Daher behandeln andere Browser als Internet Explorer sie als normale Kommentare und ignorieren sie vollständig.
2. Der IE bestimmt, ob der Inhalt im bedingten Kommentar wie der normale Seiteninhalt basierend auf der if-Bedingung analysiert werden soll.
3. Bedingte Kommentare verwenden die HTML-Kommentarstruktur und können daher nur in HTML-Dateien, nicht in CSS-Dateien verwendet werden.

Mit dem folgenden Code können Sie die aktuelle Version des IE-Browsers ermitteln (Hinweis: In anderen Browsern als IE ist der Effekt nicht sichtbar).

Code kopieren
Der Code lautet wie folgt:

<!--[wenn IE]>
<h1>Sie verwenden den Internet Explorer-Browser</h1>
<!--[wenn IE 5]>
<h2>Version 5</h2>
<![endif]-->
<!--[wenn IE 5.0]>
<h2>Version 5.0</h2>
<![endif]-->
<!--[wenn IE 5.5]>
<h2>Version 5.5</h2>
<![endif]-->
<!--[wenn IE 6]>
<h2>Version 6</h2>
<![endif]-->
<!--[wenn IE 7]>
<h2>Version 7</h2>
<![endif]-->
<![endif]-->

Was ist, wenn der aktuelle Browser IE ist, aber die Version niedriger als IE5 ist? Sie können <!--[if ls IE 5]> verwenden. Bedingte Kommentare können natürlich nur in der IE5+-Umgebung verwendet werden, daher wird <!--[if ls IE 5]> überhaupt nicht ausgeführt.
lte: ist die Abkürzung für Less than or equal to, was kleiner als oder gleich bedeutet.
lt: Es ist die Abkürzung für Less than, was weniger als bedeutet.
gte: ist die Abkürzung für Greater than or equal to, was größer als oder gleich bedeutet.
gt: Dies ist die Abkürzung für „Greater than“, was „größer als“ bedeutet.
! : Bedeutet ungleich, was dasselbe ist wie der ungleich-Beurteilungsoperator in JavaScript.

Sind bedingte Kommentare ein CSS-Hack? Sind bedingte Kommentare ein CSS-Hack?
Genau genommen handelt es sich um einen CSS-Hack. Denn genau wie jeder andere echte CSS-Hack ermöglicht es uns, einigen Browsern spezielle Stile zuzuweisen, und es ist nicht auf einen Browserfehler angewiesen, um einen anderen Browser (Stil) zu steuern. Darüber hinaus können Bedingungsanweisungen auch verwendet werden, um Dinge zu tun, die über den Rahmen von CSS HACK hinausgehen (obwohl dies selten vorkommt).

Da die bedingte Beurteilung nicht auf einem Browser-Hack beruht, sondern eine gut durchdachte Funktion ist, bin ich davon überzeugt, dass sie bedenkenlos verwendet werden kann. Natürlich können auch andere Browser Bedingungssätze unterstützen (bisher tun sie das nicht), aber es erscheint unwahrscheinlich, dass sie eine Syntax wie <!--[if IE]> verwenden werden.

So wenden Sie bedingte Kommentare an <br />In diesem Artikel wird zu Beginn erklärt, dass die von uns erstellten WEB-Standardseiten unterschiedlich interpretiert werden, da verschiedene Versionen des Internet Explorers unterschiedliche Interpretationen aufweisen, insbesondere die Interpretation von CSS. Um mit ihnen kompatibel zu sein, können wir sie mithilfe bedingter Kommentare separat definieren und so letztendlich das Ziel der Kompatibilität erreichen. Zum Beispiel:

Code kopieren
Der Code lautet wie folgt:

<!-- Standardmäßig wird zuerst das Stylesheet css.css aufgerufen-->
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[wenn IE 7]>
<!-- Wenn der IE-Browser Version 7 ist, rufen Sie das Stylesheet ie7.css auf -->
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
<!--[wenn lte IE 6]>
<!-- Wenn die IE-Browserversion kleiner oder gleich 6 ist, rufen Sie das Stylesheet ie.css auf -->
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->

Dies unterscheidet die Ausführung von CSS in Browsern niedriger als IE7 und IE6, um Kompatibilität zu erreichen. Gleichzeitig kann die Standard-css.css in der ersten Zeile auch mit anderen Nicht-IE-Browsern kompatibel sein.

Hinweis: Der Standard-CSS-Stil sollte sich in der ersten Zeile des HTML-Dokuments befinden und der gesamte Inhalt für die bedingte Kommentarbeurteilung muss sich nach dem Standardstil befinden.
Beispielsweise wird der folgende Code in Rot angezeigt, wenn er im Internet Explorer-Browser ausgeführt wird, jedoch in Schwarz, wenn er in anderen Browsern ausgeführt wird. Wenn das bedingte Kommentarurteil in der ersten Zeile steht, kann es nicht umgesetzt werden. Dieses Beispiel kann gut veranschaulichen, wie das Kompatibilitätsproblem zwischen dem IE-Browser und einem Nicht-IE-Browser gelöst werden kann.

Code kopieren
Der Code lautet wie folgt:

<style type="text/css">
Körper{
Hintergrundfarbe: #000;
}
</Stil>
<!--[wenn IE]>
<style type="text/css">
Körper{
Hintergrundfarbe: #F00;
}
</Stil>
<![endif]-->

Gleichzeitig versuchen manche Leute möglicherweise, <!--[if !IE]> zu verwenden, um die Situation in Nicht-IE-Browsern zu definieren. Beachten Sie jedoch: Bedingte Kommentare können nur in IE-Browsern ausgeführt werden. Dieser Code führt die Definition unter der Bedingung in Nicht-IE-Browsern nicht nur nicht aus, sondern wird auch als Kommentar ignoriert.
„Normal“ ist der Standardstil und bedingte Kommentare werden nur ausgeführt, wenn eine spezielle Verarbeitung für IE-Browser erforderlich ist.
In HTML-Dateien, nicht in CSS-Dateien.

<<:  Lösungen für ungültige Nullsegmentbeurteilungen und IFNULL()-Fehler in MySql

>>:  So erstellen Sie einen SFTP-Server und einen Image-Server auf einem Linux-Cloud-Server

Artikel empfehlen

Lösung für Nginx-Installationsfehler

1. Entpacken Sie nginx-1.8.1.tar.gz 2. Entpacken ...

W3C Tutorial (6): W3C CSS Aktivitäten

Ein Stylesheet beschreibt, wie ein Dokument angez...

Zusammenfassung der Tipps zur Verwendung von coalesce() in MySQL

Vorwort Kürzlich habe ich zufällig MySQLs Coalesc...

Nginx-Dienst 500: Interner Serverfehler einer der Gründe

500 (Interner Serverfehler) Auf dem Server ist ei...

MySQL-Tutorial versteht gespeicherte Prozeduren gründlich

Inhaltsverzeichnis 1. Konzepte im Zusammenhang mi...

JavaScript ist unzuverlässig undefiniert

undefined Wenn wir in JavaScript feststellen möch...

Der beste Weg, ein JAR-Paketprojekt unter einem Centos7-Server zu starten

Vorwort Jeder weiß, wie man ein JAR-Paket unter L...

Sehr praktische Methode zur Implementierung des Tomcat-Startskripts

Vorwort Es gibt ein Szenario, in dem das Unterneh...