揭秘CSS(第 1 版)
1.4.3 百分数
阅读(

概述

CSS简介

CSS开发环境

CSS语法

CSS属性的值

长度

数字

百分数

百分数由一个数字和一个百分号组成,数字和百分号之间,不允许出现空格。百分数可以是整数或小数,可以是正数或负数。如果数字为0,则可以省略百分号。

百分比的值几乎总是相对于另一个值(如长度单位)计算得到的。每一个允许使用百分比单位的属性,都要定义百分比的参考值。大多数情况下,百分比的参考值都是元素本身的字体大小,即 font-size 属性的值。如:

div  { 
    font-size: 14px;
    line-height: 200%; 
} 

由于 line-height 属性是基于当前元素 font-size 的值计算得到的。上述代码就表示,line-height 属性的值为font-size属性值的 200%,故得到的行高为 200% * 14px = 28px。

CSS中,所有可继承的属性,如果其属性值使用百分比单位来定义,则子元素继承的是计算后的结果,而不是百分比的值。所以,上述代码中,无论子元素 font-size 的值是多少,子元素的行高始终是28px。

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》,并全部在 GitHub 上开源。

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我写出更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验