请选择 进入手机版 | 继续访问电脑版

资源299论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

日本代购,韩国代购,专业海外代购服务
查看: 279|回复: 5

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

[复制链接]

2889

主题

3164

帖子

1万

积分

超级版主

Rank: 8Rank: 8

积分
10519
发表于 2019-2-28 10:34:45 | 显示全部楼层 |阅读模式
先领券再购物更优惠
深入了解css的行高Line Height属性
什么是行间距?
古时候我们使用印刷机来出来文字。印刷出来的每个字,都位于独立的一个块中。
行间距,即传说中控制两行文字垂直距离的东东。在CSS中,line-height被用来控制行与行之间垂直距离。
不过,行间距与半行间距,还是取决于CSS中的line-height。那么,如何来使用line-height呢?
默认状态,浏览器使用1.0-1.2 line-height, 这是一个初始值。你可以定义line-height属性来覆盖初始值:p{line-height:140%}
你可以有5种方式来定义line-height。
1.line-height可以被定义为:body{line-height:normal;}
2.line-height可以被定义为:body{line-height:inherit;}
3.line-height可以使用一个百分比的值body{line-height:120%;}
4.line-height可以被定义为一个长度值(px,em等) body{line-height:25px;}
5.line-height也可以被定义为纯数字, body{line-height:1.2}

缩写line-height
那5种line-height写法,可以在font属性中缩写。line-height的值紧跟着font-size值使用斜杠分开,如:<font-size>/<line-height>
实例:body{font:100%/normal  arial;} , body{font:100%/120%  arial;} ,body{font:100%/1.2  arial;}  ,body{font:100%/25px  arial;}

计算line-height
有些CSS属性是可继承的(inherited),从层叠的元素里传递下来。这样做是为了方便开发者,不再为后代元素重新设值。
对于line-height继承有点复杂。
云博淘享惠商城,商品多多,优惠券多多,福利多多,转发还能赚零花钱,关注微信公众号“云博淘享惠商城”吧!!
回复

使用道具 举报

0

主题

247

帖子

562

积分

高级会员

Rank: 4

积分
562
发表于 2019-3-30 15:56:54 | 显示全部楼层
先领券再购物更优惠
让杀人犯被捕时被发现他随身携带的除了一把手枪之外还有的就是它的复印件的好帖! 伸缩门 http://www.ssmdd.com
我爱学习啊
回复

使用道具 举报

0

主题

247

帖子

562

积分

高级会员

Rank: 4

积分
562
发表于 2019-4-7 17:59:44 | 显示全部楼层
先领券再购物更优惠
潜水出来冒泡! 伸缩门http://www.ssmdd.com
我爱学习啊
回复

使用道具 举报

0

主题

21

帖子

46

积分

新手上路

Rank: 1

积分
46
发表于 2019-9-1 16:51:51 | 显示全部楼层
先领券再购物更优惠
发财了
回复

使用道具 举报

2

主题

23

帖子

52

积分

注册会员

Rank: 2

积分
52
发表于 2019-9-1 20:57:19 | 显示全部楼层
先领券再购物更优惠
暴利行业都有哪些
回复

使用道具 举报

0

主题

20

帖子

66

积分

禁止发言

积分
66
发表于 2019-9-3 10:31:30 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐上一条 /3 下一条

QQ|Archiver|手机版|小黑屋|资源299论坛

GMT+8, 2019-9-17 15:12 , Processed in 0.027203 second(s), 24 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表