font-variant css大小写字母

2011-06-27 14:49:26 通过DIV+CSS让文字英文单词英文字母全大写，通过div css font-variant让对象字母无论大小写变成全大写字母但会让字母缩小显示，也就是缩小英文字母并大写样式显示，css5深入通过实例教程为大

使用DIV+CSS让英文单词全大写之CSS font-variant英文字母全大写后缩小字体篇

平时我们会遇到在一篇文章中遇到英文单词或英文字母，但又想让这些字母无论是半角小写还是大写，统一让这些英文字母全变成大写，此时我们就可以使用CSS来让其英文字母变成全大写但字母会被缩小。此时我们就需要用到DIV CSS中样式属性font-variant

目录

font-variant : normal | small-caps

CSS参数：
normal : 正常的字体
small-caps : 让字母变成小型的大写字母字体并缩小字母

HTML8描述：
我们通过DIV CSS让文章中英文单词或字母都变大写并缩小显示。

Css样式选择器我们命名为HTML8,在html中用class引用。
1、CSS代码：

.HTML8{font-variant:small-caps}

2、HTML代码片段

<div class="HTML8"> 
font-variant:small-caps实现英文或拼音字母全大写并缩小字形显示 
</div>

3、案例结果截图

CSS font-variant:small-caps大写字母并缩小案例截图
在DW软件中字体只被大写，而在浏览器中将会缩小并大写字体

通过css让英文或拼音字母全大写效果截图

说明：注意HTML8对象内内容，被css设置font-variant后，对象内所有无论是大写字母还是小写字母，最终全显示为大写的字母。

在我们日常制作网页时候，文章内插入英文教多是，需要对文章内英文字母显示大写的字母的时候我们就可以使用css样式表font-variant属性实现这一目的。

font-variant将文本里英文转为全大写，并以缩小方式显示。css font-variant实现全大写但英文或拼音字母会被缩小，如果要实现CSS英文只大写而不缩小请用css text-transform字体大小写样式。

另外CSS样式教程让文章英文或拼音字母变全大写之CSS text-transform。

以上是通过CSS样式让对象内容中出现无论大小写字母全变成大写字母。