首先是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>

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

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

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

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

在对文本进行排版,不设置p里面的h,而是只是设置lh,发现文字正好居中显示,距离很到位,效果如下line-height 对于 inline元素[包含inline-block]的意义

相关文章:

  • 2021-09-20
  • 2021-10-27
  • 2021-11-02
  • 2019-09-30
  • 2021-11-06
  • 2021-09-20
  • 2021-12-20
  • 2021-12-09
猜你喜欢
  • 2018-02-24
  • 2019-03-30
  • 2018-04-24
  • 2018-01-16
  • 2021-11-28
  • 2021-12-10
  • 2021-11-06
  • 2017-12-12
相关资源
相似解决方案