CSS將英文字元轉換為小寫例項程式碼

admin發表於2017-02-21
CSS字元

程式語言一般都帶有大小寫字母轉換的函式，使用起來比較方便，其實CSS也有這樣的屬性來進行大小寫字母的轉換，可能用到的機率要少一些而已，下面是一段例項程式碼。

[CSS] 純文字檢視 複製程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>CSS教程</title> 
<style type="text/css"> 
.capitalize .content{text-transform:capitalize;} 
.uppercase .content{text-transform:uppercase} 
.lowercase .content{text-transform:lowercase} 
</style> 
</head> 
<body> 
<div> 
  <ul class="capitalize"> 
    <li class="title">首字母轉換成大寫</li> 
    <li class="content">i am a good boy</li> 
  </ul> 
  <ul class="uppercase"> 
    <li class="title">轉換成大寫</li> 
    <li class="content">i am a good boy</li> 
  </ul> 
  <ul class="lowercase"> 
    <li class="title">轉換成小寫</li> 
    <li class="content">i am A good Boy</li> 
  </ul> 
</div> 
</body> 
</html>

具體可以參閱CSS text-transform屬性一章節。

相關文章