ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS を使用してテキストの最初の文字を大文字にするにはどうすればよいですか?

CSS を使用してテキストの最初の文字を大文字にするにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-24 06:51:15906ブラウズ

How Can I Capitalize the First Letter of Text Using CSS?

CSS での大文字化: 最初の文字の昇順

CSS を使用すると、ラベルの最初の文字を簡単に大文字に変更して、ラベルの文字を強調できます。視覚的にアピールします。

構文解決策

このスタイルの改良を実現するために、CSS は専用のプロパティを提供します。

text-transform: capitalize;

このプロパティを目的の要素に割り当てると、最初の文字が自動的に大文字に変換されます。

例例

次の HTML スニペットを考えてみましょう:

<a class="m_title" href="">gorr</a>
<a class="m_title" href="">trro</a>
<a class="m_title" href="">krro</a>
<a class="m_title" href="">yrro</a>
<a class="m_title" href="">gwwr</a>

各「m_title」要素の最初の文字を大文字にするには、単純に CSS プロパティを追加します:

a.m_title {
  text-transform: capitalize;
}

出来上がり!レンダリングされたラベルは、最初の大文字でページを装飾します:

<a class="m_title" href="">Gorr</a>
<a class="m_title" href="">Trro</a>
<a class="m_title" href="">Krro</a>
<a class="m_title" href="">Yrro</a>
<a class="m_title" href="">Gwwr</a>

以上がCSS を使用してテキストの最初の文字を大文字にするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。