line-height 行间的距离

最新推荐文章于 2023-03-28 19:40:43 发布

qq_16714671

最新推荐文章于 2023-03-28 19:40:43 发布

阅读量592

点赞数 1

分类专栏： CSS学习文章标签： css css3 html5

本文链接：https://blog.youkuaiyun.com/qq_16714671/article/details/122365199

版权

CSS学习专栏收录该内容

17 篇文章

订阅专栏

本文介绍了CSS中的line-height属性，用于设置文本行之间的距离。通过示例代码展示了如何使用line-height来调整div和p元素的行间距，以此影响文本的阅读体验。文章以实际的HTML代码片段来阐述概念，帮助读者更好地理解这一CSS属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

line-height 表示行间距大小。测量方式为：最上行顶端到下行顶端的距离

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>CSS文本外观之行间距</title>
    <style>
       div {
           line-height: 60px;
       }
       p {
           line-height: 60px;
       }
    </style>
</head>
<body>
    <div>中国人</div>
       <p>打开北京、上海与广州的地铁地图，你会看见三张纵横交错的线路网络，这代表了中国最成熟的三套城市轨道交通系统。</p>

       <p> 可即使这样，在北上广生活的人依然少不了对地铁的抱怨，其中谈及最多的问题便是拥挤——对很多人而言，每次挤地铁的过程，都像是一场硬仗。更何况，还都是败仗居多。</p>
        
       <p> 那么，当越来越多的二线甚至三线城市迎接来了自己的地铁，中国哪里的地铁是最拥挤的呢？</p>
</body>
</html>