cssline-height值为150%或1.5值有哪些区别

小编给大家分享一下css line-height值为150%或1.5值有哪些区别，希望大家阅读完这篇文章后大所收获，下面让我们一起去探讨吧！

为新华等地区用户提供了全套网页设计制作服务，及新华网站建设行业解决方案。主营业务为成都做网站、成都网站设计、新华网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

这是一个小小的不经意的问题，但是却常常被一些面试官提起。一般都会一下子进入懵逼状态，那让我们来看看区别在哪里？

我先新建一个html,代码如下：

  　　　　　　　　 父元素内容
  　　　　　　　　
  

    　　　　　　　　Web前端开发

    　　　　 　　　line-height行高问题
    　　　　　　　　
  

下图是当line-height:150%的效果，父元素的行高为150%时，会根据父元素的字体大小先计算出行高值然后再让子元素继承。所以当line-height:150%时，字元素的行高等于16px * 150% = 24px：

下图是当line-height:1.5em的效果，父元素的行高为150%时，会根据父元素的字体大小先计算出行高值然后再让子元素继承。所以当line-height:1.5em时，子元素的行高等于16px * 1.5em = 24px：

下图是当line-height:1.5的效果，父元素行高为1.5时，会根据子元素的字体大小动态计算出行高值让子元素继承。所以，当line-height:1.5时，子元素行高等于30px * 1.5 = 45px：

看完了这篇文章，相信你对css line-height值为150%或1.5值有哪些区别有了一定的了解，想了解更多相关知识，欢迎关注创新互联行业资讯频道，感谢各位的阅读！