Pouvez-vous étirer verticalement du texte à l’aide de CSS sans l’agrandir ?

Transformation CSS : Transformation de texte

Pouvez-vous étirer le texte en utilisant CSS ? Vous ne voulez pas que la police soit plus grande, car cela rendrait le texte plus épais que le texte plus petit à côté. Vous voulez simplement étirer le texte verticalement, en le déformant. Cela devrait être dans un div et le texte normal dans un autre div à côté. Comment faites-vous cela ?

Solution : Utiliser les transformations CSS 2D

En fait, vous pouvez utiliser les transformations CSS 2D pour y parvenir. Presque tous les navigateurs modernes (y compris IE9) prennent en charge cette fonctionnalité. Voici un exemple :

<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>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!