如何使用 CSS 將文字從小寫轉換為大寫？

CSS 文字轉換：小寫到大寫

您可以使用 CSS 調整文字以將其從小寫轉換為大寫嗎？

了解需求

考慮一個場景，您希望按以下方式設定文字格式：

• 先小寫，然後隻大寫每個單字的第一個字母.
• 輸入：HELLO WORLD
• 輸出：Hello World

另一個範例可能是全部大寫的國家/地區列表，例如：UNITED KINGDOM，您可以選擇需要轉換為：英國。

CSS 實作

是的，CSS 提供了 text-transform 屬性來實現此目的。透過將其設為“大寫”，您可以將每個單字的第一個字母大寫，同時將其餘字元轉換為小寫。

<code class="css">.className {
    text-transform: capitalize;
}</code>

此CSS 規則適用於類別名稱為className 的元素，相應地轉換其文字.

Javascript解決方案

除了CSS之外，還可以利用JavaScript來實現文字轉換：

<code class="javascript">function capitalize(s) {
    return s.toLowerCase().replace(/\b./g, function (a) {
        return a.toUpperCase();
    });
}

console.log(capitalize('this IS THE wOrst string eVeR')); // "This Is The Worst String Ever"</code>

此函數將字串s作為輸入，將其轉換為小寫，然後使用正則表達式來識別單字邊界(b) 並將每個辨識單字的第一個字元大寫。

注意： 感謝 JavaScript 函數到以下資源：將字串中的單字大寫。

以上是如何使用 CSS 將文字從小寫轉換為大寫？的詳細內容。更多資訊請關注PHP中文網其他相關文章！