text-transform:capitalize;これを読んでいる場合は、CSS プロパティが THIS を This に変換しないことに気付いたでしょう。代わりに、先頭以外の文字は大文字のままであるため、この場合、変換は効果がありません。では、どうすればこの結果を達成できるのでしょうか?
私はこれが頻繁に尋ねられるのを見てきました.ほとんどの答えは、これを達成するためにjavascriptを使用して促進するのが簡単です. これは機能しますが、Wordpress、Drupal、または Joomla などの PHP CMS のテンプレート/テーマを作成またはカスタマイズしている場合は不要です。
text-transform : title-case悪いニュースは、結果がタイトルケースになることを保証するようなものがないということです. 良いニュースは、JavaScript を必要としない方法があることです (この状況でよく提案されます)。CMS のテーマを作成している場合は、strtolower() を使用ucwords()して、関連するテキストをタイトル ケースに変換できます。
前 (これは機能しません):
<style>
.title-case{ text-transform:capitalize; }
</style>
<span class="title-case">ORIGINAL TEXT</span>
後：
<?php echo ucwords( strtolower('ORIGINAL TEXT') ); ?>
テーマを作成している場合、おそらくテキスト文字列ではなく変数を使用することになりますが、関数と概念は同じように機能します。以下は、Wordpress のネイティブ関数get_the_title()を使用して、ページ タイトルを変数として返す例です。
<?php
$title = get_the_title();
$title = strtolower($title);
$title = ucwords($title);
<h1>
<?php echo $title;
</h1>
?>
これが誰かに役立つことを願っています。ハッピーコーディング。
これは、Virtuemart 1 を実行している Joomla 1.5.22 Web サイトでの実際の例です。目的は、元は大文字の文字列を取得し、適切な大文字に変換することです。
大文字:
<?php echo $list[$i]->name; ?>
適切なケース:
<?php echo ucwords( strtolower($list[$i]->name) ); ?>
これは、次の 1 つの単純なルールで実現できます。
text-transform: capitalize;
あなたはただ書くtext-transform: none;