line-height 对于 inline元素[包含inline-block]的意义

最新推荐文章于 2022-09-14 15:24:13 发布

Fade Away

最新推荐文章于 2022-09-14 15:24:13 发布

阅读量1k

点赞数

文章标签： CSS基础

本文链接：https://blog.csdn.net/qq_26239917/article/details/88378979

版权

首先是inline元素，就拿普通文本来讲

标题line-height 先简称lh吧，height简称h

lh表现为文本的字号加上上半间距加下半间距

<style>
			.box{
				line-height: 200px;
				background-color: salmon;
					
					/* height: 300px; */
			}
		
		</style>
	</head>
	<body>
		<div class="box">
			CSS真难
		</div>
	</body>

上面红框的高度为上半间距，下面的为下半间距

块级父元素被内容撑开，所以给未设置高度的块级元素内部的内联元素设置lh相当于设置了块级元素的高度

本质上块级元素和lh是没有关系的

在对文本进行排版，不设置p里面的h,而是只是设置lh,发现文字正好居中显示，距离很到位，效果如下

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Fade Away

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
line-height 对于 inline元素[包含inline-block]的意义

首先是inline元素，就拿普通文本来讲标题line-height 先简称lh吧，height简称hlh表现为文本的字号加上上半间距加下半间距&amp;lt;style&amp;gt; .box{ line-height: 200px; background-color: salmon; /* height: 300px; */ } &amp;lt;/s...
复制链接

扫一扫