福彩幸运武林开奖 ?
歡迎來到DIVCSS5查找CSS資料與學習DIV CSS布局技術!
您的位置:DIVCSS5首頁 > DIV+CSS基礎 >

CSS基礎必學列表

DIV CSS text-transform英文字母全大寫小寫_CSS首字母大寫

使用DIV+CSS讓文章中英文單詞或拼音的第一個字母大寫、使用CSS讓文章中英文單詞或拼音全大寫、使用DIV CSS讓文章中出現英文單詞或拼音全小寫教程實例CSS text-transform實例布局教程

平時我們常常在國外報紙、英文文章、國外網站看見文章中英文單詞或拼音的首個字母大寫,或文章中拼音或英文單詞字母全小寫或全大寫,今天DIVCSS5為大家介紹讓英文單詞或拼音首個字母大寫、全文中英文單詞全大寫或小寫的方法教程,這里我們介紹使用text-transform來實現首字母大寫、全文大寫、全文小寫布局教程方法。

DIV CSS text-transform英文字母首字母大寫小寫-英文字母全小寫篇

一、結構語法   -   TOP

1、text-transform 值:
Capitalize 英文拼音的首字母大寫
Uppercase 英文拼音字母全大寫
Lowercase 英文拼音字母全小寫

2、CSS text-transform語法結構
div{text-transform:capitalize}

css text-transform結構分析圖
text-transform結構分析圖

二、英文或拼音單詞首字母大寫   -   TOP

此DIV CSS樣式針對每個英文單詞或拼音的首個字母大寫
text-transform : capitalize

三、英文或拼音單詞字母全大寫   -   TOP

此CSS樣式實現無論拼音或單詞英文字母都會全部實現轉換為大寫
text-transform : uppercase

四、英文或拼音單詞字母全小寫   -   TOP

此DIV+CSS樣式實現無論拼音或字母或英文單詞,本身是否大寫都將轉換為全部小寫
text-transform : lowercase

五、CSS英文單詞大寫或小寫案例   -   TOP

1、CSS代碼片段:

  1. .shou_daxie{text-transform:capitalize} 
  2. .quan_daxie{text-transform:uppercase} 
  3. .quan_xiaoxie{text-transform:lowercase} 

2、HTML源代碼片段:

  1. <div class="shou_daxie"> 
  2.     首字母大寫 ni hao hello 
  3. </div> 
  4. <div class="quan_daxie"> 
  5.     字母全實現大寫ni hao hello 
  6. </div> 
  7. <div class="quan_xiaoxie"> 
  8.     字母全實現小寫ni HAo hEllo無論字母是否被大寫都將被CSS小寫 
  9. </div> 

3、CSS英文字母大寫小寫,全小寫大寫,首字母(css text-transform)案例截圖

css英文字母全大寫小寫與首字母大寫應用示范案例截圖
CSS首字母大寫與英文字母全大寫全小寫案例截圖

六、CSS字母大寫與CSS字母小寫總結   -   TOP

這里DIVCSS5介紹了css text-transform實現首字母大寫、英文字母全小寫、英文字母全大寫使用與語法。如果要掌握可以復制DIV CSS大寫小寫案例代碼親自實踐,靈活運用。對于文字排版,特別是英文或拼音字母要求大小寫首字母大小寫均可使用text-transform樣式屬性。

CSS英文字母大寫后縮小http://www.mcowk.com.cn/rumen/r308.shtml

無論文中大寫還是小寫,無論是首字母大寫還是全部大寫或小寫,我們可以使用text-transform來實現,同時要想實現文中字母大寫后字母縮小我們可以使用css font-variant來實現。如有任何疑問可到CSS論壇發表自己看法或疑問。

如需轉載,請注明文章出處和來源網址:http://www.mcowk.com.cn/rumen/r309.shtml

我要分享到:

必備CSS教程 Essential CSS Tutorials

必備HTML基礎教程 Essential HTML Tutorials

 

如對文章有任何疑問請提交到DIV CSS論壇,或有任何網頁制作CSS問題立即到CSS論壇發貼求解 或 直接DIVCSS5網頁頂部搜索遇到DIVCSS疑問。
CSS教程文章修訂日期:2013-02-04 10:47 原創:DIVCSS5
本文www.mcowk.com.cn DIVCSS5版權所有。

福彩幸运武林开奖