Direkter Link zum Artikel: Hinzufügen von Fluid-Typografie-Unterstützung zu WordPress Block Themes

Hinzufügen von Fluid-Typografie-Unterstützung zu WordPress Block Themes

Fluid typografie ist eine schicke Art, „Schrifteigenschaften wie Größe oder Zeilenhöhe zu beschreiben, die sich fließend an die Größe des Viewports anpassen“. Sie ist auch unter anderen Namen bekannt, wie z. B. Responsive Typografie, Flexible Typografie, Fluid Typografie usw.

Avatar of Ganesh Dahal
Ganesh Dahal am
Direkter Link zum Artikel Verwenden Sie CSS Clamp, um ein flexibleres Wrapper-Utility zu erstellen

Verwenden Sie CSS Clamp, um ein flexibleres Wrapper-Utility zu erstellen

Ich mag Andys Idee hier

.wrapper {
  width: clamp(16rem, 90vw, 70rem);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

Normalerweise würde ich hier einfach eine max-width setzen, aber wie Andy sagt

Dies wird zu einem leichten Problem in mittelgroßen Viewports, wie zum Beispiel

Avatar of Chris Coyier
Von Chris Coyier am
Direkter Link zum Artikel Lineare Skalierung der Schriftgröße mit CSS clamp() basierend auf dem Viewport

Lineare Skalierung der Schriftgröße mit CSS clamp() basierend auf dem Viewport

Responsive Typografie wurde in der Vergangenheit mit einer Vielzahl von Methoden wie Media Queries und CSS calc() versucht.

Hier werden wir einen anderen Weg erkunden, um Text linear zwischen einem Satz von minimalen und maximalen ... zu skalieren.

Avatar of Pedro Rodriguez
Pedro Rodriguez am
Direkter Link zum Artikel Beyond Media Queries: Using Newer HTML & CSS Features for Responsive Designs

Beyond Media Queries: Using Newer HTML & CSS Features for Responsive Designs

Neben der Verwendung von Media Queries und modernen CSS-Layouts wie Flexbox und Grid zur Erstellung responsiver Websites gibt es bestimmte übersehene Dinge, die wir gut machen können, um responsive Websites zu erstellen. In diesem Artikel werden wir uns eine Reihe von Werkzeugen ansehen (die sich um ... drehen).

Avatar of David Atanda
David Atanda am