line-height属性的细节
与大多数CSS属性不同,line-height支持属性值设置为无单位的数字。有无单位在子元素继承属性时有微妙的不同。

语法
line-height: normal | <number> | <length> | <percentage>
normal 根据浏览器决定,一般为1.2。
number 仅指定数字时(无单位),实际行距为字号乘以该数字得出的结果。可以理解为一个系数,子元素仅继承该系数,子元素的真正行距是分别与自身元素字号相乘的计算结果。大多数情况下推荐使用,可以避免一些意外的继承问题。
length 具体的长度,如px/em等。
percentage 百分比,100%与1em相同。

有单位(包括百分比)与无单位之间的区别
有单位时,子元素继承了父元素计算得出的行距;无单位时继承了系数,子元素会分别计算各自行距(推荐使用)。

其实区别就在于继承的问题上。

150%是根据父元素的字体大小计算出行高,并且子元素依然沿用这个计算后的行高(例如30px行高值,而不是按照比例去重新计算)。
而1.5则是根据子元素自己字体的大小去乘以1.5来计算行高。
另,1.5em等也是按照150%的情况来算的。

line-height属性的更多相关文章

  1. 深入了解css的行高Line Height属性

    什么是行间距? 古时候我们使用印刷机来出来文字.印刷出来的每个字,都位于独立的一个块中. 行间距,即传说中控制两行文字垂直距离的东东.在CSS中,line-height被用来控制行与行之间垂直距离. ...

  2. 25.按要求编写一个Java应用程序: (1)编写一个矩形类Rect,包含: 两个属性:矩形的宽width;矩形的高height。 两个构造方法: 1.一个带有两个参数的构造方法,用于将width和height属性初化; 2.一个不带参数的构造方法,将矩形初始化为宽和高都为10。 两个方法: 求矩形面积的方法area() 求矩形周长的方法perimeter() (2)通过继承Rect类编写一个具有

    package zhongqiuzuoye; //自己写的方法 public class Rect { public double width; public double height; Rect( ...

  3. DedeCMS文章页去img图片width和height属性

    方法一:正则匹配去除 打开include/ arc.archives.class.php,查找代码: //设置全局环境变量 $this->Fields['typename'] = $this-& ...

  4. 如何理解VB窗体中的scale类属性及width height属性之间的关系

    如何理解VB窗体中的scale类属性及width height属性之间的关系 VB中的SCALEHIEGT,SCALEWIDTH,与窗体中的WIDTH,HEIGHT的区别及关系是许多VB初学者难以理解 ...

  5. 解决BootstrapTable设置height属性后,表格不对齐的问题

    解决BootstrapTable设置height属性后,表格不对齐的问题 2018年03月06日 09:56:54 nb7474 阅读数 5920     一般在使用BootstrapTable 插件 ...

  6. 使用@property 添加width 和 height 属性

    @property Python内置的@property装饰器就是负责把一个方法变成属性调用的: class Screen(object): def isint(self,px): if not is ...

  7. CSS基础学习(一) 之 line-height 与 height 属性区别

    官方定义: height:定义了了元素的高度.默认情况下,该属性订了 content area(内容区域) 的高度.如果box-sizing属性设置为 border-box,那么height就表示bo ...

  8. 按要求编写一个Java应用程序: (1)编写一个矩形类Rect,包含: 两个属性:矩形的宽width;矩形的高height。 两个构造方法: 1.一个带有两个参数的构造方法,用于将width和height属性初化; 2.一个不带参数的构造方法,将矩形初始化为宽和高都为10。 两个方法: 求矩形面积的方法area() 求矩形周长的方法perimeter() (2)通过继承Rect类编写一个具有确定位

    package com.hanqi.test; public class Rect { ; ; public double getWidth() { return width; } public vo ...

  9. height属性

    高度属性: height:长度值|百分比|auto 最大高度:max-height 最小高度:min-height 说明:设置块级元素和替换元素的内容高度.

  10. CSS中详解height属性

    目录结构: contents structure [+] hight属性值类型一览表 height的%的使用 定义 实例 需要注意的 参考文章 hight属性值类型一览表 value describt ...

随机推荐

  1. nvm的安装与配置和基本使用(学习总结)

    nvm是来管理node的一个工具,为了方便使用不同版本的node.js运行环境,我们应该学习如何使用他 nvm安装方式 1.下载nvm,大家可以去github上下载,但因为github的CDN被墙,访 ...

  2. Redis各数据结构常用命令

    redis 通用API keys * 遍历所有key 一般不在生产环境中使用 redis单线程,容易阻塞其他命令执行 O(n) dbsize 计算key的总数 O(1)exists 检查key是否存在 ...

  3. centos7.2+jdk7.9搭建haddoop2.7.0伪分布式环境(亲测成功)

    最近想研究下hadoop,玩一玩大数据,废话不多说,就此开始! 所用环境:   xshell 5.0(ssh连接工具,支持ftp,可向虚拟机传文件) CentOS-7-x86_64-DVD-1511. ...

  4. FEL,项目实装记录

    FEL,即Fast EL ,版本0.8,具体内容我就不贴了,自行百度 实装遇到的问题: Spring Boot 打包后无法进行表达式编译. 根据百度以及源码,确定这东西是在用JavaCompiler将 ...

  5. codeforces E. DNA Evolution(树状数组)

    题目链接:http://codeforces.com/contest/828/problem/E 题解:就是开4个数组举一个例子. A[mod][res][i]表示到i位置膜mod余数是res的‘A’ ...

  6. CodeForces Round#480 div3 第2场

    这次div3比上次多一道, 也加了半小时, 说区分不出1600以上的水平.(我也不清楚). A. Remove Duplicates 题意:给你一个数组,删除这个数组中相同的元素, 并且保留右边的元素 ...

  7. U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索

    指南:U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索   U盘便携式hexo随处写博客 简述:在任意一台联网的电脑上续写he ...

  8. .NET Core 3.0及ASP.NET Core 3.0 前瞻

    前几天微软发布了 .NET Core 3.0 Preview 9 ,这是.NET Core 3.0 最后一个预览版. .NET Core 3.0 正式发布将在.NET Conf 上发布,.NET Co ...

  9. CentOS7 中防火墙配置

    systemctl  stop firewalld.service  #停止firewall systemctl disable firewalld.service #禁止firewall开机启动 开 ...

  10. dropwizard-core模块和应用启动分析

    简介 Dropwizard是一款开发运维友好.高效.RESTful web服务的框架.Dropwizard将稳定.成熟的java生态系统中的库整合为一个简单的.轻量级的包,即跨越了库和框架之间的界限, ...