So erstellen Sie reaktionsschnelle Schriftart in CSS

Linux -Hinweis

Geben Sie in der CSS -Datei die “anSchriftgröße”Eigenschaft mit dem Wert“2.5VW”. Dadurch reagiert die Schrift in Bezug auf die Seitenbreite.

CSS

P
Schriftgröße: 2.5vw;

Speichern Sie Ihren Code und testen Sie ihn in Ihrem Browser:

Methode 2: Verwenden von Medienabfragen zum Erstellen reaktionsschneller Schriftarten in CSS

In CSS, “Medien-Anfragen„Helfen Sie, verschiedene Stylingbedingungen für bestimmte Elemente anzuwenden. Es ist ein Regelsatz, der nur angewendet werden kann, wenn die definierte Bedingung wahr ist. In der Entwicklung werden Medienabfragen häufig verwendet, um Elemente oder Entwürfe in Bezug auf Mediengeräte/-typen reaktionsschnell zu machen. Wenn die Eigenschaft mit Schriftgröße innerhalb der @media-Regeleinstellung platziert wird, erzielt sie die gewünschten Ergebnisse.

Beispiel

Setzen Sie die Seite Mindestbreite der Seite als “799px"Verwenden"@Medien”Und fügen Sie die hinzu

Element in dieser Regeleinstellung. Dies zeigt an, dass die definierte Regel nur angewendet wird, wenn die Seitenbreite gleich oder mehr als 799px ist. Geben Sie nun das an “SchriftgrößeEigentum als "20px”. Dadurch wird die Schrift größer als ihre normale Größe.

CSS

@media (Min-Width: 799px)
P
Schriftgröße: 20px;

Ausgang

Methode 3: Verwenden von Clamp (), um reaktionsschnelle Schriftarten in CSS zu erstellen

Der "Klemme()Die Funktion wird verwendet, um einen festen Mindest- und Maximalwert festzulegen. Mit anderen Worten, es wird üblicherweise als Anfangs- und Endbereich für einen bestimmten Wert definiert. Die CLAMP () -Funktion bietet eine große Kontrolle über die Elemente im Zusammenhang mit ihrer Reaktionsfähigkeit.

Beispiel

Verwenden "Schriftgröße"Eigentum entlang des Wertes"Klemme (10px, 2.5vw, 30px)Wenn der 10px der Mindestwert ist, ist 30px das Maximum und die 2.5VW ist der aktuelle Wert der ausgewählten Schriftart. Diese Funktion wird die Schrift unter den definierten Grenzen ansprechen.

CSS

P
Schriftgröße: Clamp (10px, 2.5vw, 30px);

Ausgang

Wir haben drei effiziente Methoden beschrieben, um eine reaktionsschnelle Schriftart in CSS zu erstellen.

Abschluss

Um eine reaktionsschnelle Schriftart zu erstellen, “Ansichtsfenster","Medien-Anfragen" oder "Clamp () Funktion" kann verwendet werden. Es gibt vier Ansichtsfenster VW, VH, VMIN und VMAX, die dazu beitragen, reaktionsschnelle Schriftarten zu erstellen. Darüber hinaus wird CSS @Media verwendet, um verschiedene Stylingbedingungen auf bestimmte Elemente anzuwenden. Die CLAMP () -Funktion kann auch verwendet werden, um Schriftarten ansprechend zu machen. In diesem Artikel haben wir behandelt, wie man reaktionsschnelle Schriftarten in CSS erstellt.