Dies ist ein weniger auffälliges Problem, wenn chinesische und englische Schriftarten im IE-Browser gemischt werden.
Es kommt also wieder die Frage auf, was die Ursache für die Abweichung zwischen Chinesisch und Englisch ist. ! Was ist die Lösung? ! Nach meinen Tests habe ich zwei Situationen gefunden (natürlich kann es noch mehr verursachende Situationen geben. Sie können es selbst ausprobieren. Die benachbarten Elemente der chinesischen und englischen Objekte verfügen über die Attributeinstellung „Vertikal ausrichten“ (z. B. das vorherige kleine Bild). oder das Textfeld, wir müssen sie vertikal ausrichten: Wenn wir sie für Bilder und Textfelder (alle anderen Inline-Blockelemente) festlegen, wirkt sich dies auf die Fehlausrichtung von Chinesisch und Englisch aus.
Eine andere Situation besteht darin, dass, wenn für das übergeordnete Element (außer Tabellen) das Attribut „Vertical-Alignment“ festgelegt ist, auch Chinesisch und Englisch der darin enthaltenen untergeordneten Elemente falsch ausgerichtet sind.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<Kopf>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Test</title>
<style type="text/css">
* { margin:0; padding:0 }
html {Hintergrund:#fff;
body { position:relative; font:12px/1.6em Verdana, Lucida, Arial, Helvetica, serifenlose Farbe: #333;
</style>
</head>
<Körper>
<div style="vertical-align:middle;">
<a href="">Warum bin ich immer falsch ausgerichtet? warum??</a>
</div>
</body>
</html>
Wie kann dieses Problem gelöst werden? !
Lassen Sie uns zunächst über das erste sprechen, das die Lösung für das durch die vertikale Mitte benachbarter Elemente verursachte Fehlausrichtungsproblem darstellt:
Fügen Sie den chinesischen und englischen Objekten einen Zoom: 1 hinzu, um dessen Haslayout auszulösen Es hat ein Haslayout, die chinesischen und englischen Objekte werden nicht falsch ausgerichtet sein.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<Kopf>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Test</title>
<style type="text/css">
* { margin:0; padding:0 }
html {Hintergrund:#fff;
body { position:relative; font:12px/1.6em Verdana, Lucida, Arial, Helvetica, serifenlose Farbe: #333;
</style>
</head>
<Körper>
<div>
<a href="" style="zoom:1;">Warum bin ich immer falsch ausgerichtet? warum??</a>
</div>
</body>
</html>
Der zweite Fall ist die Lösung für das durch die vertikale Mitte des übergeordneten Elements verursachte Fehlausrichtungsproblem:
Fügen Sie den chinesischen und englischen Objekten den Satz Vertical-align:baseline hinzu, um das Problem zu lösen!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<Kopf>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Test</title>
<style type="text/css">
* { margin:0; padding:0 }
html {Hintergrund:#fff;
body { position:relative; font:12px/1.6em Verdana, Lucida, Arial, Helvetica, serifenlose Farbe: #333;
</style>
</head>
<Körper>
<div style="vertical-align:middle;">
<a href="" style="vertical-align:baseline;">Warum bin ich immer falsch ausgerichtet? warum??</a>
</div>
</body>
</html>
Aber wir können sehen, dass die Unterstreichung zu eng ist. Zu diesem Zeitpunkt müssen wir noch zoom:1 hinzufügen, um das hasLayout auszulösen, damit es nicht zu eng wird. .
<a href="" style="zoom:1;"vertical-align:baseline;">Warum bin ich immer falsch ausgerichtet? Warum?</a>
Wenn Sie auf andere Situationen stoßen, in denen Chinesisch und Englisch falsch ausgerichtet sind. In diesem Fall: Sie können auch versuchen, das Problem mit den beiden oben genannten Methoden zu lösen. Der sicherste und effektivste Weg ist natürlich die Verwendung von Song Dynasty sowohl auf Chinesisch als auch auf Englisch.