您的位置：首页 > Web前端 > HTML

HTML基础学习-14-font字体属性设置

2017-06-11 21:18 726 查看

<!DOCTYPE  html>
<!--
font-size: 大小设定  百分比设定(是在父元素基础上)   smaller  larger 比父元素的大还是小  inherit继承父元素

font-family 定义字体样式，可以使用,隔开， 在没有前一个时候使用后一个   一般用英文 如微软雅黑英文是  Microsoft YaHei
font-weight 字体加粗  normal正常400  bold粗700  bolder更粗 lighter更细
100~900的取值范围  必须是整数
font-style  normal正常   italic斜体  oblique倾斜 inherit继承
font-variant   normal small-caps小型大写字母显示文本  inherit
-->
<head>
<title>font 属性设置</title>
<meta charset="utf-8">
<style type="text/css">
body{
font-size:40px;
font-style:italic;
}
h1,h2{
font-size:100%;
}
h2{
font-size:200%
}
.ha{
font-family:'微软雅黑';
font-size:smaller
font-weight:lighter;
}
.hb{
font-size:larger;
font-weight:bolder
}
.fa{
font-style:normal;
}
.fb{
font-style:italic;
}
.fc{
font-style:oblique;
}
.fd{
font-style:inherit;
}
.pa{
font-variant:normal;
}
.pb{
font-variant:small-caps;
}
.pc{
font-variant:inherit;
}

</style>
</head>

<body>
<p>
字体类型1
</p>
<h1 class="ha">
字体1
</h1>
<h2 class="hb">
字体2
</h2>

<em class="fa">
字体1 font-style</em>
<br>
<em class="fb">字体2 font-style</em>
<br>
<em class="fc">字体3 font-style</em>
<br>
<em class="fd">字体4 font-style</em>

<br>
<p class="pa">
abnormal1
</p>
<br>
<p class="pb">
abnormal2
</p>
<br>
<p class="pc">
abnormal3
</p>
</body>

</html>

跟随视频学习，手写记录自己学习过程中的点点滴滴，一起加油吧。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： html font-css

相关文章推荐

新的分享

章节导航