CSS 有些属性可以让子节点从父节点或祖先节点继承,文本、字体、列表属性等样式都可以被子节点继承。子节点没有自身的样式,子节点将继承父节点或祖先节点的样式。

<ul class="container">
<li class="child-1">child 1</li>
<li class="child-2">
child 2
<ul class="container-2">
<li class="child-a">child A</li>
<li class="child-b">child B</li>
</ul>
</li>
</ul>

设置祖先节点ul的颜色属性color

.container {
color: #7979DE;
}

子节点有自身的样式,不继承父节点的样式:

.container-2 {
color: #00B7FF;
}

页面字体大小、字体颜色都可以设置在最高级节点内(body、html),其所有后代节点都将使用祖先节点的样式,省去了每一次都要设置字体样式等。

CSS 子节点继承父节点(祖先节点)的样式的更多相关文章

  1. 剑指Offer(第二版)面试案例:树中两个节点的最低公共祖先节点

    (尊重劳动成果,转载请注明出处:http://blog.csdn.net/qq_25827845/article/details/74612786冷血之心的博客) 剑指Offer(第二版)面试案例:树 ...

  2. QT之setstylesheet防止子窗体继承父窗体样式

    /* 1.这里的#号表示,主控件不会影响子控件 2.设置多个样式,可以用双引号和分号 */ ui->groupBox_1->setStyleSheet("#groupBox_1{ ...

  3. Delphi - 子窗体继承父窗体后如何显示父窗体上的控件

    1.创建子窗体Form1 File -> New -> Form,新建一个form,在form的单元文件中修改 2.子窗体中引用父窗体单元 uses TFatherForm 3.将子窗体中 ...

  4. CSS子元素居中(父元素宽高已知,子元素未知)

    <style> .container{width:400px; height:400px; position:relative;} .center{position:absolute; l ...

  5. Javascript禁止子元素继承父元素的事件

    3种方法1.在父元素事件的function中加if(event.target==this){ }2.子元素事件function最后加event.stopPropgation():// 阻止事件冒泡3. ...

  6. css 子div自适应父div高度

    <div class="out"> <div class="a"></div> <div class="b& ...

  7. CSS子元素在父元素中水平垂直居中的几种方法

    1. 水平居中(margin: auto;)子父元素宽度固定,子元素上设置 margin: auto; 子元素不能设置浮动,否则居中失效. #div1{ width: 300px; height: 3 ...

  8. jQuery如何阻止子元素继承父元素事件?

    <a> <b></b> </a> $("a").click(...); 这种绑定的话,b也会响应一次事件,如何只对a元素绑定事件,而 ...

  9. jquery如何阻止子元素继承父元素的事件(又称事件冒泡)

    非常简单,子元素上添加如下代码即可 $('a').click(function(e){ e.stopPropagation(); }); 老版本为event,现在用e就行

随机推荐

  1. Markdown的使用指南

    # Markdown学习 ------ 以下符号均是英文输入法下的 ## 1.标题 几级标题就写 几个#号 加 空格 加 标题内容 就可以 例如: ###加空格加三级标题效果如下 ### 三级标题 # ...

  2. 【Java面试】Mysql为什么使用B+Tree作为索引结构

    一个工作8年的粉丝私信了我一个问题. 他说这个问题是去阿里面试的时候被问到的,自己查了很多资料也没搞明白,希望我帮他解答. 问题是: "Mysql为什么使用B+Tree作为索引结构" ...

  3. Ribbon的ServerStats引起内存泄露问题总结

    问题描述 服务运行一段时间之后,出现页面卡顿加载慢的问题,使用top命令查看了服务器的使用情况,发现CPU飙高,接着查看了该进程中每个线程的占用情况,发现导致CPU高的线程是JVM垃圾回收的线程,然后 ...

  4. cookie 案例 记住上一次的访问时间

    需求:记住上一次的访问时间 第一次访问Servlet 提示 欢迎首次访问 之后的访问 都提示 您上次的访问时间为:"""""""& ...

  5. Linux 文件权限相关知识

    文件权限说明 Linux中的文件能否被访问和工具(程序)无关,和访问的用户身份有关(谁去运行这个程序) 进程的发起者(谁去运行这个程序). 进程的发起者若是文件的所有者: 拥有文件的属主权限 进程的发 ...

  6. python超级有用的实战项目,拿走不谢~

    写在前面的一点P话: Python是目前最好的编程语言之一.由于其可读性和对初学者的友好性,已被广泛使用. 那么要想学会并掌握Python,可以实战的练习项目是必不可少的. 直接上第一个项目~ 猜字游 ...

  7. 重磅硬核 | 一文聊透对象在 JVM 中的内存布局,以及内存对齐和压缩指针的原理及应用

    欢迎关注公众号:bin的技术小屋 大家好,我是bin,又到了每周我们见面的时刻了,我的公众号在1月10号那天发布了第一篇文章<从内核角度看IO模型的演变>,在这篇文章中我们通过图解的方式以 ...

  8. Detecting Rumors from Microblogs with Recurrent Neural Networks(IJCAI-16)

    记录一下,很久之前看的论文-基于RNN来从微博中检测谣言及其代码复现. 1 引言 现有传统谣言检测模型使用经典的机器学习算法,这些算法利用了根据帖子的内容.用户特征和扩散模式手工制作的各种特征,或者简 ...

  9. C++记录一

    题目一: [描述] 比较两个整数之间的大于.小于.等于.不等于关系. [输入] 输入在一行中给出2个整数a和b. [输出] 分行输出整数a和b之间的大于.小于.等于.不等于关系. [输入示例] 5 3 ...

  10. IDEA快捷键-03

    用了很久的eclipse,换了新的公司,跟着团队的习惯也转到idea上来了.在这里记录下对idea的认识,常用的idea快捷键及使用技巧. 对比eclipse每个workspace打开一个窗口,ide ...