CSSでテキストを大文字・小文字に自動変換する方法

CSSで英語などのテキストを大文字・小文字に自動変換するプロパティを知りたい。
本記事ではこのような悩みを解決。
text-transformプロパティを使って、大文字・小文字に自動変換する方法を解説します。
大文字に自動変換
/* 文字を小文字に変換 */
p {
text-transform: lowercase;
}
大文字に自動変換するにはtext-transform: lowercase;を使います。
小文字に自動変換
/* 文字を大文字に変換 */
p {
text-transform: uppercase;
}
小文字に自動変換するにはtext-transform: uppercase;を使います。
自動変換させない
/* 文字を自動変換させない */
p {
text-transform: none;
}
逆に自動変換させない場合はtext-transform: none;を使います。
サイト修正などでベースのCSSが影響し、勝手に文字が大文字・小文字になる場合は検証してtext-transformプロパティが使われてないか確認してみましょう。
まとめ
text-transformプロパティを使って英語テキストを大文字・小文字に変換する方法について紹介しました。
以上で解説を終わります。
目次