最新消息:Excel无乱码转CSV,由于工作原因很少更新博客和回复大家的评论,非常抱歉。

DIV+CSS让英文单词字母全大写font-variant

本文关键字font-variantcss font-variantdiv font-variantcss字母大写字母大写

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

1、css font-variant语法

font-variant : normal | small-caps

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

2、DIV+CSS font-variant实例

描述:
我们通过DIV CSS让文章中英文单词或字母都变大写。

Css样式选择器我们命名为hicoogle,在html中用class引用。
CSS代码:
.hicoogle{font-variant:small-caps;}

测试html内容:
<div>我是hicoogle案例实验,abc我源代码是小写字母abc,我的CSS样式被设置font-variant样式为small-caps</div>

完整DIV+CSS代码:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>hicoogle实例教程之文章字母全被CSS样式设置为小型地大写</title>
<style>
.hicoogle{font-variant:small-caps;}
</style>
</head>
<body>
<div>我是hicoogle案例实验,
abc我源代码是小写字母abc,我的CSS样式被
设置font-variant样式为small-caps</div>
</body>
</html>

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

3、CSS教程总结

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

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

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

转载请注明:嗨酷哥,有你更酷! » DIV+CSS让英文单词字母全大写font-variant

与本文相关文章

发表我的评论

取消评论
表情 插代码

Hi,您需要填写昵称和邮箱!

  • 必填项
  • 必填项