子元素会继承父元素的某些css属性

通常跟字体相关的属性都能被继承,具体的可以在mdn里查询是否是可继承属性

属性值的计算过程(渲染过程)

按照页面文档的树形目录结构进行依次渲染

前提条件:渲染的元素的所有CSS属性必须有值

一个元素从所有属性都没有值到所有属性都有值,这个计算过程,叫做属性值计算过程

(以下四步,每一步可能会确定一些属性值,没有确定的,继续下一步确定)

确定声明值:参考样式表中没有冲突的声明,作为CSS属性值(比如作者样式表中没有,浏览器默认有值,则使用浏览器的)

层叠冲突:对样式表中有冲突的声明使用层叠规则,确定CSS属性值

使用继承:对仍然没有值的属性,若可以继承,则继承父元素的值

使用默认值:最后还没有确定的值,使用默认值(不是浏览器设置的值)

小技巧:强制继承   color:inherit; 继承父元素的值,一些不能继承的属性,也可以用这种方法。

使用默认值:color:initial;当不知道默认值是什么的时候,使用这种办法。

CSS学习(7)继承、属性值的计算过程的更多相关文章

  1. 【CSS学习】--- position属性

    一.前言 1.HTML中的三种布局方式: 标准流(普通流):网页中默认的布局方式,即顺序布局 浮动:float 定位:position 2.position属性的作用方式: 给position属性设置 ...

  2. css的五种属性值----在路上(21)

    在CSS中,每个属性的属性值都有一定的范围,并且不同类型的属性值有不同的值.对于一个属性,必须取得正确的属性值,才能被浏览器正确地解释,因此一定要弄清每种类型的属性值范围.在CSS中属性一般有以下几种 ...

  3. 【CSS学习】--- z-index属性

    一.前言 网页显示实际上是三维的,我们直观看到的有x轴和y轴,但在网页布局上还有一个z轴. 对于定位元素,我们使用top.right.left.bottom来实现元素在x-y平面上的定位,但为了表示布 ...

  4. 【CSS学习】--- overflow属性

    一.前言 在网页布局中,未处理的溢出元素绝对算得上是个“毒瘤”.因为如果一个“盒子”周围还有其它元素,而从这个盒子中溢出的元素会和盒子周围的元素发生层叠,并脱离了整个HTML元素,所以我们应当合理使用 ...

  5. [TimLinux] JavaScript 获取设置在CSS类中的属性值

    1. 设置属性值 // 常用方式 var myEl = document.getElementById('idMyEl'); myEl.style.display = "none" ...

  6. javascript之复习(css属性值的计算)

    js取div的宽高咋办,css有content-box,border-box,padding-box,表现又不一样.好在有个offsetWidth, <style type="text ...

  7. css中的position属性值的探究

    css的position属性指定了元素的定位类型,然后通过top,botton,left,right来具体定位. 在具体定位之前必须使用position属性,否则所有的具体定位属性都无法生效. pos ...

  8. CSS3学习笔记之属性值

    font-family 设置文本的字体名称. font-style 设置文本样式. 取值 normal不使用斜体. italic使用斜体. oblique使用倾斜体. inherit从父元素继承. f ...

  9. css学习_css常见属性用法

    1.元素的显示模式 a.被动转换:浮动.绝对定位.固定定位(转换为行内块元素特性的模式---不设置宽度时,模式换行为行内块模式后宽度是内容宽度.) b.主动转换:display:block  / in ...

随机推荐

  1. mysql远程链接(可以在服务器上配置然后在本地连接远程服务器)

    ps:如果一下的连接不成功原因:一定要关闭windows防火墙或者linux的防火墙 1.在服务器端授权(黄色标记的地方第一个是用户名,第二个的意思是可以远程连接,第三个是密码) GRANT ALL  ...

  2. 0216 aop和打印数据库执行日志

    需求 maven依赖 <dependency> <groupId>p6spy</groupId> <artifactId>p6spy</artif ...

  3. linux 关键字搜索文件

    在www目录下查找包含关键字’summer’,且后缀名为php文件的操作命令 find /www/ -name '*.php' |xargs grep '/Summer'

  4. eclipse下载更新可用的SDK 2018-11-12

    懒人方法: mirrors.neusoft.edu.cn:80 操作步骤: 1. Android SDK Manager----Tools----Options-----Http Proxy Serv ...

  5. C++-POJ2955-Brackets[DP]

    题意就是,找出最长合法子括号序列 容易想到设f[l][r]为l~r的最长合法子括号序列的长度 然后从短的状态往长的状态枚举,不断更新答案就可以了 //#include<bits/stdc++.h ...

  6. zabbix4.2配置监控华为路由器:基于ENSP模拟器

    一.基于ENSP模拟器的华为路由器 这里是华为模拟器中的设备,并不是真机,所以要先保证华为模拟器中的网络设备可以和物理主机.虚拟机能通信,这是前提.如何保证通信请看之前的文章:https://www. ...

  7. visual env VS conda environment of python

    1. There's two types of python environment in pycharm: virtualenv Environment conda environment For ...

  8. 接口自动化框架(Pytest,Allure,Yaml)

    框架链接:https://www.jianshu.com/p/e31c54bf15ee 目前是基于他的框架做了些改动(主要是session.action()和json格式传参). 后续优化,应该主要思 ...

  9. Python - 反向遍历序列(列表、字符串、元组等)的五种方式

    1. reversed() a = [1, 2, 3, 4] for i in reversed(a): print(i) 2. range(len(a)-1, -1, -1) a = [1, 2, ...

  10. mongo备份操作

    数据备份mongodump 可以用mongodump 来做MongoDB 的库或表级别的备份,下面举例说明: >c:\mongo\bin\mongodump -d  xxxx数据库 此时会在当前 ...