Bolehkah anda meregangkan teks secara menegak menggunakan CSS tanpa menjadikannya kelihatan lebih besar?

Transformasi CSS: Transformasi Teks

Bolehkah anda meregangkan teks menggunakan CSS? Anda tidak mahu fon menjadi lebih besar kerana itu akan menjadikan teks kelihatan lebih tebal daripada teks yang lebih kecil di sebelahnya. Anda hanya mahu meregangkan teks secara menegak, mengubah bentuknya. Ini sepatutnya dalam satu div dan teks biasa dalam div lain di sebelahnya. Bagaimana anda melakukan ini?

Penyelesaian: Gunakan CSS 2D Transforms

Sebenarnya, anda boleh menggunakan CSS 2D Transforms untuk mencapai ini. Hampir semua pelayar moden (termasuk IE9) menyokong ciri ini. Berikut ialah contoh:

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

Atas ialah kandungan terperinci Bolehkah anda meregangkan teks secara menegak menggunakan CSS tanpa menjadikannya kelihatan lebih besar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!