Was ist der Unterschied zwischen px und em in HTML5?

Unterschiede: 1. Die Einheitslänge ist unterschiedlich, px ist die Einheit der digitalen Bildlänge und em ist ein Vielfaches der Zeichenbreite. 2. Die relativen Objekte sind unterschiedlich, px ist relativ zur Bildschirmauflösung und em ist relativ zum Text in der aktuellen Objektschriftgröße. 3. Der Wert von px ist fest, es ist alles, was Sie angeben, und die Berechnung ist einfacher. Der Wert von em ist nicht festgelegt, und em erbt die Schriftgröße des übergeordneten Elements.

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

PX

px Pixel. Pixel px beziehen sich auf die Bildschirmauflösung des Monitors.

PX-Funktionen

1. Der Grund, warum die meisten ausländischen Websites em oder rem als Schriftarteinheit verwenden können; . Firefox kann px, em und rem anpassen, aber mehr als 96 % der chinesischen Internetnutzer verwenden den IE-Browser (oder Kernel).

EM

em ist die Schriftgröße relativ zum Text im aktuellen Objekt. Wenn die aktuelle Schriftgröße für Inline-Text nicht manuell festgelegt wurde, ist sie relativ zur Standardschriftgröße des Browsers.

EM-Funktionen

1 Der Wert von em ist nicht festgelegt 2. Der Unterschied zwischen

px und em:

1 Die Längeneinheit ist unterschiedlich. px ist die Längeneinheit des digitalen Bildes und em ist das Vielfache der Zeichenbreite.

2. Verschiedene relative Objekte

px ist relativ zur Bildschirmauflösung, em ist relativ zur Schriftgröße des Textes im aktuellen Objekt.

3. Verschiedene Werte

Der Wert von px ist fest, was auch immer Sie angeben, und er ist einfacher zu berechnen. Der Wert von em ist nicht festgelegt und em erbt die Schriftgröße des übergeordneten Elements.

Hinweis:

Die Standardschrifthöhe jedes Browsers beträgt 16 Pixel. Alle unveränderten 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 Font-size=62,5 % deklarieren, wodurch der em-Wert 16px*62,5%=10px wird, also 12px=1,2em, 10px=1em , auch Das heißt, Sie müssen nur Ihren ursprünglichen px-Wert durch 10 teilen und dann zu em als Einheit wechseln. Wenn wir also CSS schreiben, müssen wir auf zwei Punkte achten:

1. Deklarieren Sie Font-size=62,5 % im Body-Selektor;

2. Teilen Sie Ihren ursprünglichen px-Wert durch 10 und ersetzen Sie ihn dann durch em Als Einheit;

3. Berechnen Sie den em-Wert dieser vergrößerten Schriftarten neu. Vermeiden Sie wiederholte Angaben zu Schriftgrößen.

Damit soll das Phänomen 1,2 * 1,2 = 1,44 vermieden werden. Wenn Sie beispielsweise in #content die Schriftgröße als 1,2em deklarieren, kann die Schriftgröße von p, wenn Sie sie deklarieren, nur 1em und nicht 1,2em sein, da dieses Em nicht das Em ist und die Schriftart erbt Höhe von #content. Es wurde 1em=12px.

Verwandte Empfehlungen: „

HTML-Video-Tutorial

“

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen px und em in HTML5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!