Kann man Text mit CSS vertikal strecken, ohne dass er größer erscheint?

CSS-Transformation: Texttransformation

Kann man Text mit CSS strecken? Sie möchten nicht, dass die Schriftart größer ist, da der Text dadurch dicker erscheint als der kleinere Text daneben. Sie möchten den Text lediglich vertikal strecken und verformen. Dies sollte sich in einem Div befinden und der normale Text in einem anderen Div daneben. Wie macht man das?

Lösung: Verwenden Sie CSS-2D-Transformationen

Eigentlich können Sie CSS-2D-Transformationen verwenden, um dies zu erreichen. Fast alle modernen Browser (einschließlich IE9) unterstützen diese Funktion. Hier ist ein Beispiel:

<code class="html"><p>I feel like <span class="stretch">stretching</span>.</p></code>

<code class="css">span.stretch {
    display:inline-block;
    -webkit-transform:scale(2,1); /* Safari and Chrome */
    -moz-transform:scale(2,1); /* Firefox */
    -ms-transform:scale(2,1); /* IE 9 */
    -o-transform:scale(2,1); /* Opera */
    transform:scale(2,1); /* W3C */
}</code>

Das obige ist der detaillierte Inhalt vonKann man Text mit CSS vertikal strecken, ohne dass er größer erscheint?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!