font-variant 属性设置小型大写字母的字体显示文本,这意味着所有的小写字母均会被转换为大写。
注意:所有使用小型大写字体的字母与其余文本相比,其字体尺寸更小。
font-variant:normal|small-caps|inherit;
值 | 说明 (索引中有详细介绍) |
normal | 默认值。浏览器会显示一个标准的字体。 |
small-caps | 浏览器会显示小型大写字母的字体。 |
inherit | 规定应该从父元素继承 font-variant 属性的值。 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>NTHOME-零基础入门学习Web(HTML5+CSS3)</title>
<style type="text/css">
.normal {font-variant: normal}
.small {font-variant: small-caps}
</style>
</head>
<body>
<p class="normal">normal: Lorem ipsum dolor sit amet, consectetur adipisicing elit. At cumque deserunt dolorum ea eaque eos error esse et exercitationem harum itaque nostrum nulla officiis quaerat qui, quidem ratione recusandae tempora.</p>
<br>
<p class="small">small-caps: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam atque blanditiis culpa dolore dolorem doloribus, esse eum, eveniet expedita laudantium magnam minima nisi pariatur quae quam quia, quisquam sunt vero.</p>
</body>
</html>
normal: Lorem ipsum dolor sit amet, consectetur adipisicing elit. At cumque deserunt dolorum ea eaque eos error esse et exercitationem harum itaque nostrum nulla officiis quaerat qui, quidem ratione recusandae tempora.
small-caps: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam atque blanditiis culpa dolore dolorem doloribus, esse eum, eveniet expedita laudantium magnam minima nisi pariatur quae quam quia, quisquam sunt vero.
表格中的数字表示支持该属性的第一个浏览器版本号。
Safari | Chrome | FireFox | IE |
1.0 | 1.0 | 1.0 | 5.0 |