增强阅读体验:设置“字体大小”和“行高”
2008-02-08
大连
/others/2008/02/08/css-font-line.html
others
本文最近更新于 2017 年 10 月 09 日
用 CSS 语法可以设置“文字大小”和“行高”,不仅可以使各浏览器的文字显示效果统一,也可以让阅读更加舒适。
CSS font-size 和 line-height 基本語法
font-size: 设定值;
line-height: 设定值;
设定值
的取值参考:font-size line-height
示例:
<html>
<head>
<style type="text/css">
p {font-size: 14px}
p.small
{
line-height: 14px
}
p.big
{
line-height: 30px
}
</style>
</head>
<body>
<p>
这是拥有标准行高的段落。
在大多数浏览器中默认行高大约是 20px。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
这是拥有标准行高的段落。
</p>
<p class="small">
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
这个段落拥有更小的行高。
</p>
<p class="big">
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
这个段落拥有更大的行高。
</p>
</body>
</html>
关于作者
最近更新: