CSSを使用してテキストを大きく見せずに垂直方向に伸ばすことはできますか?

Linda Hamilton
リリース: 2024-10-28 02:18:02
オリジナル
555 人が閲覧しました

Can you vertically stretch text using CSS without making it appear larger?

CSS 変換: テキスト変換

CSS を使用してテキストを拡張できますか?フォントを大きくすると、テキストが隣の小さいテキストよりも太く見えるため、フォントを大きくしないでください。テキストを垂直方向に引き伸ばして変形させたいだけです。これは 1 つの div にあり、通常のテキストはその隣の別の div にある必要があります。これはどうやって行うのですか?

解決策: CSS 2D Transform を使用します

実際には、CSS 2D Transform を使用してこれを実現できます。ほとんどすべての最新のブラウザ (IE9 を含む) がこの機能をサポートしています。以下に例を示します:

<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>
ログイン後にコピー

以上がCSSを使用してテキストを大きく見せずに垂直方向に伸ばすことはできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!