在CSS3樣式屬性中，字體樣式屬性font-variant可以設(shè)置或判斷文本內(nèi)容是否為小型大寫字母，對應(yīng)的屬性值有： normal：顯示正常的字體 small-caps：顯示小型的大寫

在CSS3樣式屬性中，字體樣式屬性font-variant可以設(shè)置或判斷文本內(nèi)容是否為小型大寫字母，對應(yīng)的屬性值有：

• normal：顯示正常的字體
• small-caps：顯示小型的大寫字母字體

下面利用一個實例來說明font-variant屬性的用法，操作如下：

第一步：創(chuàng)建HTML文件

雙擊打開HBuilder工具，在創(chuàng)建的Web項目指定目錄下新建靜態(tài)頁面，并引入需要的引用的文件。

第二步：插入輸入框和按鈕

在lt;bodygt;標(biāo)簽元素內(nèi)插入一個輸入框和按鈕，并使用Bootstrap控制它們的樣式。

第三步：保存代碼并預(yù)覽頁面

保存代碼并預(yù)覽該靜態(tài)頁面，可以在瀏覽器上查看到一個按鈕和一個輸入框。

第四步：添加按鈕點擊事件

利用jQuery初始化函數(shù)，在這里添加按鈕單擊事件，設(shè)置輸入框中的font-variant屬性。

第五步：查看效果

再次保存并預(yù)覽頁面，輸入"How are you？"，點擊按鈕查看效果。

第六步：效果展示

可以看到輸入框中的文本首字母變?yōu)榇髮懙?，并且字體變小了。