1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <title></title>
  6.         <style type="text/css">
  7.             .li{color: #25A725;}
  8.             .li #a{color: #25A725;}
  9.         </style>
  10.     </head>
  11.     <body>
  12.         <ul>
  13.             <li id="li1">li1</li>
  14.             <li id="li12">li12</li>
  15.             <li id="li11">li11</li>
  16.             <li id="li13" class="li"><span>li13</span></li>
  17.             <li id="li15" class="li"><a href="#">li15</a> </li>
  18.             <li id="li15" class="li"><a href="#" id="a">li17</a> </li>
  19.             <li id="li18">li18</li>
  20.         </ul>
  21.     </body>
  22. </html>

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

  1. .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、涉及到的知识点：

  1.  

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. java的静态代码块和类变量的隐式覆盖

    静态代码块特点:随着类的加载执行一次,且仅会执行一次 作用:初始化类中的static修饰的变量(static修饰的变量称为类变量.类变量和静态代码块差不多,类变量仅会被初始化一次) 一.静态代码块写法 ...

  2. c语言实现--单向循环链表操作

    1,什么叫单向循环链表.单向循环链表是指在单链表的基础上,表的最后一个元素指向链表头结点,不再是为空. 2,由图可知,单向循环链表的判断条件不再是表为空了,而变成了是否到表头. 3,链表的结点表示 1 ...

  3. 二、Jmeter 后置处理器（BeanShell PostProcessor）

    1.新建JDBC Request,如下图所示: 重要的参数说明: Variable Name:数据库连接池的名字,需要与JDBC Connection Configuration的Variable N ...

  4. JavaScript事件绑定的三种方式

    (一)事件绑定的三种方式 (1)通过on的形式 <script type="text/javascript"> var div = document.getElemen ...

  5. WMI在渗透测试中的重要性

    0x01 什么是wmi WMI可以描述为一组管理Windows系统的方法和功能.我们可以把它当作API来与Windows系统进行相互交流.WMI在渗透测试中的价值在于它不需要下载和安装, 因为WMI是 ...

  6. React.js vs Vue.js All in One

    React.js vs Vue.js All in One React 与 Vue 区别对比 https://vuejs.org/v2/guide/comparison.html 1. 使用人数, 社 ...

  7. URLSearchParams & Location & URL params parse

    URLSearchParams & Location & URL params parse URL params parse node.js env bug node.js & ...

  8. TypeScript 面试题汇总(2020 版)

    TypeScript 面试题汇总(2020 版) TypeScript 3.9 https://www.typescriptlang.org/zh/ TypeScript 4.0 RC https:/ ...

  9. record terminal sessions

    record terminal sessions asciinema https://asciinema.org/ # install $ brew install asciinema # Start ...

  10. leetcode solution cracked tutorial

    leetcode solution cracked tutorial problemset https://leetcode.com/problemset/all/ Top Interview Que ...