line-height: 2和line-height: 200%的区别

line-height: 2和line-height: 200%是有区别的。 两个属性设置给具体的某一个元素时是没有区别的。如下图:

line-height=2;

line-height=200%

那么他们的区别又在哪里呢?区别就是他们设置两种不同的属性后其子元素表现样式上的区别! 可以看下面的例子:

  • 父元素设置line-height: 200%;属性时 父元素设置这个属性后,其所有子元素的行高都是一个具体的值,即他们父元素字体大小的200%。


    line-height: 200%;属性下子元素行高是具体的值
  • 父元素设置line-height: 2;属性时 父元素设置这个属性后,其所有子元素的行高都是自身字体大小的2倍。下例可看出子元素的行高都是不一致的。


    line-height= 2;属性下子元素行高都是一个相对自身字体大小的值
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • line-height: 2和line-height: 200%是有区别的。 两个属性设置给具体的某一个元素时是没...
    苏英伟阅读 5,401评论 0 1
  • line-height: 2和line-height: 200%都表示行高是字体大小的2倍,但是它们是有区别的。当...
    辉夜乀阅读 4,922评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,679评论 1 92
  • 1. 前言 前端圈有个“梗”:在面试时,问个css的position属性能刷掉一半人,其中不乏工作四五年的同学。在...
    YjWorld阅读 10,071评论 5 15
  • 当珞珈的樱花盛开时,家乡的桃花、杏花也在忙着绽放。粉红的桃花,白色的杏花,美美地一树一树地开着。 小时,在我和哥哥...
    猫儿尾巴阅读 2,563评论 0 5