suchen

Heim >Web-Frontend >js-Tutorial >Ausführliche Erklärung von Javascript, um Webseiten mit verschiedenen Browsern kompatibel zu machen

Ausführliche Erklärung von Javascript, um Webseiten mit verschiedenen Browsern kompatibel zu machen

小云云
小云云Original
2018-01-29 17:24:071660Durchsuche

In diesem Artikel werden hauptsächlich relevante Informationen zu von JavaScript entwickelten Webseiten vorgestellt, die mit verschiedenen Browsern kompatibel sind. Hier finden Sie verschiedene Methoden, die Ihnen bei der Beherrschung solcher Funktionen helfen können.

Vorwort:

Es ist ein alltägliches Problem, dass es überall im Internet Tutorials gibt, die nicht allzu neu sind und lediglich eine persönliche Zusammenfassung darstellen Ich hoffe, es ist hilfreich für Anfänger.

1. CSS-HACK

Die folgenden zwei Methoden können heute fast alle HACKs lösen.

1, !wichtig

Mit der Unterstützung von !important durch IE7 ist die !important-Methode jetzt nur noch für den HACK von IE6 verfügbar. (Achten Sie auf die Schreibweise. Denken Sie daran, dass die Deklarationsposition im Voraus erfolgen muss.)

<style>
#wrapper
{
width: 100px!important;
width: 80px;
}
</style>

2, IE6 /IE77 für Firefox

*+html und *html sind IE-spezifische Tags, die von Firefox noch nicht unterstützt werden. Und *+html ist ein IE7-spezifisches Tag 

<style>
#wrapper
{
#wrapper { width: 120px; }
*html #wrapper { width: 80px;}
*+html #wrapper { width: 60px;}
}
</style>

Hinweis:

*+html 对IE7的HACK 必须保证HTML顶部有如下声明：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"　"http://www.w3.org/TR/html4/loose.dtd">

2. Universeller Schwimmerverschluss (sehr wichtig!)

Informationen zum Prinzip des klaren Schwimmers finden Sie unter [So löschen Sie Floats ohne strukturelles Markup]

Fügen Sie den folgenden Code zum globalen CSS hinzu und fügen Sie class="clearfix" zum p hinzu, das geschlossen werden muss.

<style>


.clearfix:after
{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix
{
display:inline-block;
}

.clearfix {display:block;}


</style>

3. Weitere Kompatibilitätstipps (erneut)

1. Das Festlegen der Auffüllung auf p unter FF führt zu einer Vergrößerung der Breite und Höhe, IE jedoch nicht (kann mit gelöst werden). !wichtig)

2. Zentrierungsproblem.

1). Ausrichten: Mitte. (Achten Sie darauf, den Inhalt nicht umzubrechen.)
2). Stile für den Inhalt im a-Tag müssen Sie display: block; festlegen (üblich in Navigations-Tags)

4 Der Unterschied im Verständnis von BOX zwischen FF und IE führt zu einem Unterschied von 2 Pixeln . Es gibt auch Probleme wie die Verdoppelung des Randes von p, der im IE auf float eingestellt ist. Es ist am besten, ihn unter FF zu deklarieren im Voraus, um unnötigen Ärger zu vermeiden.

6 Als externer Wrapper ist es am besten, „On overflow: versteckt“ hinzuzufügen. um eine hohe Anpassungsfähigkeit zu erreichen.

7, über den Handcursor: Und die Hand gilt nur für IE.

P.S. Für IE5 und andere Browser besteht keine Notwendigkeit sich um beides zu kümmern.


Verwandte Empfehlungen:

div ＋ CSS-Design, wie Sie Ihre Webseite mit verschiedenen Browsern kompatibel machen_ html /css_WEB-ITnose

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung von Javascript, um Webseiten mit verschiedenen Browsern kompatibel zu machen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：JQuery-Maus-Hover-Navigation Unterstreichen Herausschieben Beispiel-FreigabeNächster Artikel：JQuery-Maus-Hover-Navigation Unterstreichen Herausschieben Beispiel-Freigabe

In Verbindung stehende Artikel

Mehr sehen