Das rem
Einheit wird verwendet, um Schriftarten relativ zu definieren, und nicht mit einer absoluten Größe in Pixel. Aber wussten Sie, dass diese Einheit sowohl für Layouts als auch für Typografie nützlich ist?
In diesem Video-Lernprogramm aus meinem CSS-Layout-Kurs erfahren Sie, warum die Verwendung von großem Nutzen ist rem
Einheiten für Layouts.
Im CSS-Layout-Kurs werden alle unsere Layoutspezifikationen mithilfe von rem
Einheit. Wie wir im Typografie-Kurs ausführlicher erwähnt haben, a rem
Einheit ist ein Vielfaches der Grundschriftgröße für Ihre Seite.
Das rem
Die Einheit ist nicht nur für die Typografie, sondern auch für Ihr Layout nützlich. Ich werde Ihnen zeigen, warum Sie sie verwenden sollten rem
Einheiten, wenn Sie Ihr Layout einrichten.
Beginnen wir mit einem Blick auf die Beispielseite, an der wir gerade arbeiten:
Wenn ich dann die Schriftgröße im Browser ändere, können Sie feststellen, dass die Schriftgröße auf der Seite zunimmt:
Wenn Sie jetzt die Schriftgröße erhöhen und aktualisieren, können Sie jetzt feststellen, dass das gesamte Layout angepasst wurde, um die größere Schriftgröße zu berücksichtigen.
Alles ist noch lesbar, und das ist möglich, weil rem
Damit wir unser gesamtes Layout einrichten können, stellen wir sicher, dass alles flexibel ist, abhängig von der Stammschriftgröße unseres Dokuments, die sich aus den Browsereinstellungen ergibt.
Wenn ich die Schriftgröße wieder auf eine wirklich kleine Größe verkleinere und noch einmal erneuere, können Sie feststellen, dass das gesamte Layout wieder verkleinert wurde.
Also mit diesen rem
Bei Einheiten wird darauf geachtet, dass sich der Text selbst ändert, wenn ein Benutzer die Schriftgröße ändert, und auch das gesamte Layout.
Im gesamten Kurs Start Here: Learn CSS Layout setzen Sie das Erlernte in diesem Video in die Praxis um, indem Sie verschiedene Layouts erstellen rem
Einheiten. Sie erfahren alles, was Sie wissen müssen, um die am häufigsten verwendeten Layouttypen im Webdesign zu erstellen. Wir werden die Größenanpassung, Ausrichtung, Abstände und bewährte Methoden zum Erstellen von responsivem CSS behandeln.
Wenn Sie gerade erst anfangen und CSS beherrschen möchten, lesen Sie Learn CSS: The Complete Guide.
Oder Sie können mit weiteren Kursen aus unserer "Start Here" -Serie für Anfänger im Webdesign experimentieren: