CSS - Text beim Abstieg anstatt der Grundlinie anzeigen?

8

Gibt es eine geeignete Methode, um Text in der Abstiegshöhe einer Linie statt in der Grundlinie anzuzeigen?

Bitte verweisen Sie auf die folgenden Seiten:

Ссылка )

und

Ссылка

Das Ziel ist es, die Unterseite meines Textes (wie in der Geige dargestellt) bündig mit der Unterseite des H1-Blocks zu machen, ohne Bilder zu verwenden.

Ich stelle fest, dass es flush ist, wenn ich absteigende Zeichen (p, q, usw.) verwende, aber ich werde sie nie für den Umfang dieses Projekts verwenden. Ich brauche Zeichen ohne Unterlängen, um bündig mit dem Boden des h1-Blocks zu sein.

Ich habe verschiedene Anpassungen mit Positionierung und negativen Rändern versucht, aber das wirft zwei Probleme auf 1) Die Höhe des h1 wird durcheinander gebracht. 2) die Höhe des negativen Bodens kann abhängig von der verwendeten Schriftart variieren. Gibt es einen "richtigen" Weg, dies zu tun?

Bearbeiten Bitte beachten Sie Kommentare für zusätzliche Updates ....

Beste Arbeitstechnik ist hier: Ссылка

Aber ich würde es vorziehen, die Zeilenhöhe nicht zu "animieren"

Außerdem wurde mir klar, dass eine andere Option darin bestehen würde, einen Webfont zu verwenden, bei dem die Unterseite aller Charaktere beim Abstieg anstatt der Basislinie platziert wurde, aber ich kann keinen bei Google finden. Weiß jemand, ob so etwas existiert?

    
kjl 30.05.2011, 16:10
quelle

1 Antwort

7

Was ist mit vertical-align: bottom mit line-height: 65% ?

Ссылка

    
alexcoco 30.05.2011, 18:16
quelle

Tags und Links