CSS实例【三】
作者：互联网
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
p.serif{font-family: "times new roman",times,serif;font-size: 200%;font-style: normal;}
p.sansserif{font-family: Arial, Helvetica, sans-serif;font-size:2.5rem;font-style: oblique;}//如果系统有Arial这种字体，就显示Arial这种字体。如果系统没有Arial这种字体，就以Helvetica 这种字体
p.sma{font-variant: small-caps;}
body{font-size: 100%;}
/* 未访问链接 */
/* a:link{color: #2756FE;text-decoration: none;} */
/* 已经访问的链接 */
/* a:visited{color: #7FFFD4;} */
/* 鼠标移动到链接上 */
/* a:hover{color: #FAEBD7;text-decoration: underline;font-size: 150%;} */
/* 点击时 */
/* a:active{color: #FF0000;background-color: #ffb000;font-family: "arial narrow";} */
a:link,a:visited{
display: block;
font-weight: bold;/* 定义字体粗细 */
color: #2756FE;
background-color: #7FFFD4;
width: 7.5rem;
text-align: center;
padding: 0.25rem;
text-decoration: none;
}
a:hover{
background-color: #66cfae;
}
</style>
</head>
<body>
<p class="serif">这一段的字体是 Time New roman</p>
<p class="sansserif">这一段字体是Arial</p>
<p>italic 和 oblique 都是向右倾斜的文字, 但区别在于 italic 是指斜体字，而 oblique 是倾斜的文字，对于没有斜体的字体应该使用 oblique 属性值来实现倾斜的文字效果。</p>
<p class="sma">font-variant以小型大写字体或者正常字体显示文本。（异体）This is a dog.</p>
<p><b><a href="//www.baidu.com/" target="_blank">baidu</a></b></p>
<p><b><a href="https://www.runoob.com/css/css-tutorial.html" target="_blank">cainiao</a></b></p>
<p><b>注意：hover在link和visited后，顺序不可变，active在hover后面</b></p>
</body>
</html>
好饿啊，脑子稍微动一动就很容易饿，吃货本性暴露了。
去看牙的时候，牙医小姐姐说口水这么多，是不是很馋，然后把牙吃坏了，呜呜～～
后续更新，喜欢的点关注哦
标签：Arial,color,text,oblique,实例,字体,font,CSS 来源： https://blog.csdn.net/yogurt_sweets/article/details/117998807