CSS特性值的计算

某个元素的特性值从开发者为其设置特性值到最后此元素特性值被渲染为最终实际效果,会经过以下4个步骤:

步骤

说明

1、得到指定值即specified value

指定值:可以通过多种方式设定

1)   开发者手动明确设置

2)   开发者没有明确设置,则使用继承值

3)   如果以上2种情况都不是,则使用特性的默认值(浏览器默认)

2、得到计算值即computed value

计算值:有些特性需要进行对指定值计算,如URI会被解析为绝对地址,em和ex会被计算为像素值或绝对长度

3、得到使用值即used value

对于那些特性为百分比的计算值要处理为绝对长度,此长度即为使用值。我们用浏览器自带的开发者工具看到的一个元素计算出的样式就是使用值。

4、得到实际值即actual value

经过以上3个步骤,使用值基本上成为渲染所需要的值,但是可能浏览器不支持此使用值,如某些浏览器只能显示整数类型的长度,这时浏览器会进行处理将小数变成整数(不同浏览器处理方式不同,有些四舍五入,有些直接取整),这时得到的是实际值,也就是最终渲染的效果。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值