<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.li{color: #25A725;}
.li #a{color: #25A725;}
</style>
</head>
<body>
<ul>
<li id="li1">li1</li>
<li id="li12">li12</li>
<li id="li11">li11</li>
<li id="li13" class="li"><span>li13</span></li>
<li id="li15" class="li"><a href="#">li15</a> </li>
<li id="li15" class="li"><a href="#" id="a">li17</a> </li>
<li id="li18">li18</li>
</ul>
</body>
</html>

因为a标签不能继承样式,所以

.li #a{color: #25A725;}重新设置
1、结论:由于CSS的层叠(cascading),a元素继承自li的样式(color:#25A725)被浏览器的a元素的默认样式给覆盖了。
2、理由:
看图:
图一:

图二:

由以上两个图可以知道:
1、浏览器本身对a元素有默认样式(user agent stylesheet)(图二),对span元素没有默认样式(图一)
2、由于CSS的层叠,a元素red颜色继承自div(Inherited from div)被划掉了(图二)。
3、涉及到的知识点:

												

a标签不能继承父级的颜色的更多相关文章

  1. 关于WPF中ItemsControl系列控件中Item不能继承父级的DataContext的解决办法

    WPF中所有的集合类控件,子项都不能继承父级的DataContext,需要手动将绑定的数据源指向到父级控件才可以. <DataGridTemplateColumn Header="操作 ...

  2. call继承父级属性,prototype继承父级方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Dedecms中{dede:type}标签支持调用父级栏目名称

    需求: 我们用{dede:type}标签调用栏目相关内容时,同时需要调用该栏目的父级栏目的名称. {dede:type}标签的代码做了一下开发,支持这个调用了. 开发方法: 1.打开include/t ...

  4. css ~ a标签占满父级元素

    width: 100%; height: 100%; display: block;

  5. maven项目 子父级工程。

    一 .什么是 maven 子父级工程? 建立一个maven项目,然后在该项目 下创建一个module,子级的maven,他继承于父级项目. 1.新建立 maven项目,file  ------new- ...

  6. 利用CSS背景颜色属性使父级div背景透明同时避免子级标签透明。

    实现背景色透明效果的代码 实现各个浏览器中具备良好的透明特性的效果,IE中使用私有滤镜filter,高端浏览器使用CSS3中的rgba属性. 输入十六进制的颜色值以及透明度,自动在IE的过渡滤镜以及C ...

  7. html/css更改子级继承的父级属性

    一个精美的网页需要的样式很多,在父级上设置的字体颜色或者大小,在其子元素中不一定全部相同,这时候要更改其中某一项的样式怎么办呢. 很多新手朋友就不明白,会迷惑为什么我使用class单独命名了,重新设置 ...

  8. JS - 点击事件排除父级标签

    点击事件排除父级标签,这里使用的是stopPropagation()方法.event.stopPropagation(); 对了,这里还用了解除click事件,unbind. 下面这篇博文,介绍挺全的 ...

  9. IE下 input 的父级标签被 disabled 之后引发的怪异行为

    前段时间做了个网盘类的项目,意外发现了这个情况 IE下,将input的父级标签增加 disabled 属性之后,input 的行为变得怪异: 1.input 背景变灰,疑似也被disabled 了. ...

随机推荐

  1. P2062 分队问题(DP)

    题目描述 给定n个选手,将他们分成若干只队伍.其中第i个选手要求自己所属的队伍的人数大等于a[i]人. 在满足所有选手的要求的前提下,最大化队伍的总数. 注:每个选手属于且仅属于一支队伍. 输入输出格 ...

  2. C#程序报找不到时区错误

    原因:win10电脑里的时区在win7里不全有 解决:将win10时区注册表导出,在win7电脑上安装 时区注册表路径:HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Wi ...

  3. Leetcode(27)-移除元素

    给定一个数组 nums 和一个值 val,你需要原地移除所有数值等于 val 的元素,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成 ...

  4. nodejs非安装版配置(windows)

    nodejs官网下载地址: https://nodejs.org/en/download/ 解压到本地并配置环境变量 在环境变量path中新增 D:\develop\node 查看是否配置成功 至此n ...

  5. sqli-libs(7) bool盲注

    首先打开网页后,发现页面显示outfile,  对不起,看不懂,  就直接加 ' 发现报错了 后来,查看源码得知 他是两个括号括起来的 我们就可以构造我们的payload了, 首先查询当前数据库的长度 ...

  6. 记一次小米手机安装Google Play(其他手机类似)

    记一次小米手机安装Google Play(其他手机类似) 最近换了一款小米10青春版,性价比很高,对于开发者而言,手机自带商店的软件内容往往不能满足需求,而需要单独定制习惯性的APP,博主通过最近的尝 ...

  7. React Hooks: useEffect All In One

    React Hooks: useEffect All In One useEffect https://reactjs.org/docs/hooks-effect.html https://react ...

  8. Object 循环引用 All In One

    Object 循环引用 All In One circular reference bug var a = {}; a.a = a; refs deep copy bug https://segmen ...

  9. JavaScript & Atomics

    JavaScript & Atomics Atomics 对象提供了一组静态方法对 SharedArrayBuffer 和 ArrayBuffer 对象进行原子操作. Atomics.add ...

  10. write a node cli tools, step by step

    write a node cli tools, step by step how to write a node cli tools node cli tools, step by step, nod ...