div css文字字体行高行距深入理解css行间距设置

最新推荐文章于 2024-05-13 02:38:25 发布

qq269973759

最新推荐文章于 2024-05-13 02:38:25 发布

阅读量9.2k

点赞数 4

div css文字字体行高行距 DIVCSS5带您深入理解css行间距设置，字体行距如何最简单地设置。
在文章中，要实现调节设置每行文字字体间距（行距）是使用line-height属性。
要使得每行的文字一定的间距距离所以可以通过line-height样式实现。接下来通过DIV CSS实例实现字体文字上下间距。
为了观察到行距设置效果，新建两个div盒子对象，分别div命名为“.divcss5-a”和“.divcss5-b”。
1、div+css实例完整HTML代码：

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>divcss5 css行间距实例</title> 
    <style> 
        .divcss5-a{ line-height:22px}/* css 注释说明：设置行距行高22px */ 
        .divcss5-b{ line-height:40px}/* 设置行距行高22px */ 
    </style> 
    </head> 
    <body> 
        <div class="divcss5-a"> 
            我被设置行高22px<br /> 
            我行距为22培训<br /> 
            DIVCSS5占位内容 
        </div> 
        <div class="divcss5-b"> 
            我被设置行高40px<br /> 
            我行距为40培训<br /> 
            DIVCSS5占位内容 
        </div> 
    </body> 
</html> 
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

设置了两个盒子分别css行高间隔设置为22px和40px，大家可以复制以上代码进行实践观察效果掌握css设置对象内字体文字上下行间距。掌握设置行间距行高代码是什么。

qq269973759

关注

4
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
div css文字字体行高行距深入理解css行间距设置

div css文字字体行高行距 DIVCSS5带您深入理解css行间距设置，字体行距如何最简单地设置。在文章中，要实现调节设置每行文字字体间距（行距）是使用line-height属性。要使得每行的文字一定的间距距离所以可以通过line-height样式实现。接下来通过DIV CSS实例实现字体文字上下间距。为了观察到行距设置效果，新建两个div盒子对象，分别div命名为“.div
复制链接

扫一扫