Heim >Web-Frontend >CSS-Tutorial >Detaillierte Erläuterung des Unterschieds zwischen px- und em-Einheiten in CSS
Verwenden Sie px, um Schriftarten zu definieren, und die Browser-Schriftartverstärkungsfunktion kann nicht verwendet werden, während die meisten ausländischen Websites in IE-Browsern verwendet werden können.
Ursache:
1. IE kann die Schriftgröße nicht in px-Einheiten anpassen.
2. Die meisten ausländischen Länder verwenden em als Schriftarteinheit.
px, em sind relative Längeneinheiten,
px ist relativ zur Bildschirmauflösung.
em ist die Schriftgröße relativ zum Text im aktuellen Objekt. Wenn die Schriftgröße des Texts im aktuellen Objekt nicht festgelegt wurde, ist sie relativ zur Standardschriftgröße des Browsers.
Die Standardschriftart jedes Browsers ist 16px, und alle nicht eingestellten Browser entsprechen: 1em=16px. Dann 12px=0,75em, 10px=0,625em. Um die Konvertierung der Schriftgröße zu vereinfachen, müssen Sie im Body-Selektor in CSS die Schriftgröße = 62,5 % deklarieren, wodurch der Em-Index 16 Pixel * 62,5 % = 10 Pixel wird, also 12 Pixel = 1,2 Em, 10 Pixel = 1 Em , auch Das heißt, der ursprüngliche px-Wert wird durch 10 geteilt und dann durch die em-Einheit ersetzt.
em hat die folgenden Eigenschaften:
1. Der Wert von em ist nicht festgelegt.
2.em erbt die Schriftgröße des übergeordneten Elements.
Daher muss Folgendes hervorgehoben werden:
1. Deklarieren Sie im Textselektor „font-size=62.5%“
2. Teilen Sie das Original px-Wert durch 10. Ersetzen Sie dann em als Einheit
3. Berechnen Sie den em-Wert dieser vergrößerten Schriftarten neu, um eine wiederholte Angabe der Schriftgröße zu vermeiden.
Hinweis:
Die mit der obigen Methode erhaltenen 12px (1,2em) chinesischen Zeichen entsprechen nicht der direkt durch 12px im IE definierten Schriftgröße, sondern sind etwas größer .
Sie müssen in der Körperauswahl 62,5 % auf 63 % ändern, damit es normal angezeigt wird.
Der Grund kann sein, dass bei der Verarbeitung chinesischer Zeichen durch den IE die Genauigkeit von Gleitkommawerten begrenzt ist.
Das Obige stellt Ihnen der Herausgeber vor, um den Unterschied zwischen den Einheiten px und em in CSS gründlich zu verstehen. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht Der Herausgeber wird rechtzeitig antworten. Ich möchte mich auch bei Ihnen allen für Ihre Unterstützung der chinesischen PHP-Website bedanken!
Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Unterschieds zwischen px- und em-Einheiten in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!