CSS text-transform設置文本中字母的大小寫屬性筆記

text-transform屬性定義即用法

text-transform屬性是用來定義文本中字母的大小寫,如果要改變文本中的字母或英文單詞的格式(如:單詞都有大寫字母開頭),就可以用該屬性。

text-transform屬性值

  • none:文本中的字母不做任何改變(默認);
  • capitalize:定義文本中的每一個單詞都以大寫字母開頭;
  • uppercase:定義全部為大寫字母,即文本中小寫字母變為大寫字母,大寫字母不變;
  • lowercase:定義全部為小寫字母,即將文本中的大寫字母轉換為小寫字母,原小寫字母不變;
  • Inherit:繼承父元素中text-transform的屬性的值。

text-transform語法格式:

css語法:text-transform:none / capitalize / uppercase / lowercase Inherit;

JavaScript語法:object.style.textTransform="uppercase";

實例:

<title>CSS text-transform設置文本中字母的大小寫屬性筆記/<title>

<style>

body{background: #ddd;}

#a{text-transform:capitalize;}/*單詞以大寫字母開頭*/

#b{text-transform:uppercase;}/*字母全為大寫字母*/

#c{text-transform:lowercase;}/*字母全部為小寫字母*/

none默認不會做任何轉換

capiTALize屬性值演示

upperCASE屬性值演示

lowerCASE屬性值演示

運行結果:

CSS text-transform設置文本中字母的大小寫屬性筆記

text-transform屬性演示


分享到:


相關文章: