Einstellungen in der CSS: Zeilenabstand

In CSS ist der Abstand zwischen den Linien sehr einfach einzustellen. Zu diesem Zweck gibt es eine besondere Eigenschaft. Aber natürlich gibt es viele andere Parameter, die universell sind und können auf den Text angewendet werden.

Wenn keine Einstellung erfolgt ist, werden Sie auf Standardwerte gesetzt. Sie können den Abstand ändern, falls gewünscht. Der Wert kann entweder einen Prozentsatz oder Pixel betragen.

Zeilenhöhe

Der CSS-Abstand zwischen den Linien durch die folgende Abbildung demonstriert werden.

In der obigen Abbildung zeigt die Parameter, die mit entsprechenden Abständen. Der Text ist im Raum font-size. Beachten Sie, dass die Textzeile nicht an der Basis startet und etwas höher. Der Raum vorgesehen unten an Buchstaben, die Bodenelemente (g, y, und so weiter).

Beachten Sie, dass der Raum zwischen den Blöcken font-size führenden genannt wird. Mit HTML und CSS ist diese Eigenschaft nicht erscheinen, aber es ist in den anderen Grafik- und Text-Editoren. Zum Beispiel in Adobe Photoshop.

Die Abbildung oben zeigt, wo in der „Photoshop“, Sie führen angeben. Und nächste angegebene font-size Einstellung.

Beispiele für die Verwendung line-height

In CSS kann der Abstand zwischen den Linien Prozent eingestellt werden. Ein anschauliches Beispiel ist unten angegeben.

Im Fall von kleinen Werten des Benutzers von Ihrer Website zu lesen unbequem sein.

Der Abstand kann variiert und die Größe der Schrift sein. Wenn die Differenz zwischen den Eckwerten stark in Zahlen unterscheidet, wird die Differenz durch die Zunahme führenden kompensiert.

Feinheiten des Designs

Der CSS-Abstand zwischen den Linien kann weiterhin verschiedene Einzüge anpassen. Betrachten Sie das Beispiel in der Abbildung.

Im „Elemente“ in diesem Fall wird der Text sein. Polsterung – padding ist innerhalb des Objekts, und der Rand – die Vertiefung des Objekts. Border – dieser Rahmen. Es kann 0 Bildpunkte und 100 sein kann.

Die folgende Abbildung zeigt sofort alle Ränder, die den Rahmen und die Höhe einer Textzeile.

Wenn Sie einen kleinen Text haben, die alle in einer einzigen Zeile oder jede Zeile in einem gesonderten Absatz kann der Abstand zwischen den eingekerbten Abschnitten eingestellt werden. Das ist maring und Polsterung zwischen den Zeilen in einer Zelle keine Wirkung haben. Sie schaffen den Einzug nur an den Rändern des Objekts. Objekt – diesen ganzen Absatz, statt Zeilen drin. Es ist wichtig, nicht zu verwechseln.

In Fällen, in denen eine große Anzahl von Zeilen, die alle in dem gleichen Objekt befinden, wird die Schriftart empfohlen, die grundlegenden Parameter zu ändern.

Wie der Abstand zwischen den Zeilen CSS erhöhen

Der Abstand zwischen den Zeilen HTML, können Sie zu jeder Klasse oder für alle Absätze im Text registrieren. Wenn Sie angeben, wie folgt aus: p {line-height: 20px; } – dann unbedingt alle Absätze auf der Seite werden Strings von 20 Pixel betragen. Wenn Sie an verschiedenen Orten in verschiedenen Größen wollen, empfiehlt es sich zu tun, wie folgt.

Wir verschreiben Stile.

.class1 {line-height: 20px; }

.class2 {line-height: 16px; }

.class3 {line-height: 12px; }

Aus Gründen der Klarheit, fügen wir einen Rahmen, kann so Sie sehen, dass es funktioniert. In Zukunft muss es entfernt werden.

Als nächstes benutzen wir diese Klassen. Das Ergebnis ist wie folgt.

Beachten Sie, dass im dritten Fall die Band auf den Text fuhr. Alle aufgrund der Tatsache , dass die Schriftgröße größer ist als die Höhe der Linie. Daher ist es wichtig, sicherzustellen, dass solche Konflikte nicht. Wenn Sie eine kleine Zeilenhöhe tun bzw. reduzieren die Schriftart.

Es ist nicht zu tun zu wenig Text und einen kleinen Abstand zwischen den Linien zu empfehlen. Da keiner der Benutzer nicht in der Lage sein, alles ruhig zu lesen. Er schnell müde Augen. Suchmaschinen auch sagen, dass der Text ist benutzerfreundlich.

Darüber hinaus ist in den letzten Jahren gibt es eine starke Betonung auf die Benutzerfreundlichkeit für mobile Anwender. Es Empfehlungen haben immer gesagt, dass die Schriftgröße normal sein sollte, nicht klein. Besonders stark wirkt sich auf die Referenz. Mit ihrer geringen Größe wird der Benutzer schwierig sein, Site-Navigation zu verwenden.

In der Suchmaschine „Google“ ist ein spezielles Tool, das in der Analyse hilft. Es ist sehr praktisch für Webmaster.

Hier ist ein Beispiel für die Ergebnisse, die sein kann.

Es wird empfohlen, diese Tipps zu verwenden, da diese Kriterien die Suchergebnisse beeinflussen.