[CSS] 利用 text-transform 改變字母的大小寫

分享:
標籤: CSS

在 CSS 我們可以直接透過 text-transform 設定選擇器內的字母轉換大小寫,可以設置的值有以下這些:

text-transform: capitalize;
text-transform: uppercase;
text-transform: lowercase;
text-transform: none;

舉例來說,我們有一段原始文字是 Hello world

設置 text-transform: capitalize 可以讓每個單字的首字變大寫,也就是會變成:

Hello World

 

設置 text-transform: uppercase 可以讓每個單字的首字變大寫,也就是會變成:

HELLO WORLD

 

設置 text-transform: lowercase 可以讓每個單字的首字變大寫,也就是會變成:

hello world

none 則是不會有任何變化。

 

因為直接透過 CSS 就能改變文字的大小寫很方便,如果有需要的可以使用看看。