像儿子可以继承父亲的遗产一样，在CSS中，祖先元素上的样式，也会被他的后代元素所继承,
利用继承，可以将一些基本的样式设置给祖先元素，这样所有的后代元素将会自动继承这些样式。
但是并不是所有的样式都会被子元素所继承，比如：背景相关的样式都不会被继承 边框相关的样式 定位相关的

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            body{

                font-size: 30px;

                background-color: forestgreen;

            }

        </style>

    </head>

    <body>

        <div style="background-color: yellow;">

            <p>

                我是p标签中的文字

                <span>我是span中的文字</span>

            </p>

        </div>

        <span>我是p元素外的span</span>

    </body>

</html>

效果：

前端学习 -- Css -- 样式的继承的更多相关文章

  1. CSS样式表继承详解

    最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...

  2. 前端04 /css样式

    前端04 /css样式 目录 前端04 /css样式 昨日内容回顾 css引入 选择器 基础选择器 组合选择器 属性选择器 伪类选择器 伪元素选择器 优先级(权重) 通用选择器 css样式 1高度宽度 ...

  3. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记（一） web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  4. 前端学习——css基础知识，选择器与html模板、值得收藏的html标签

    一.css需要的html(采用html5标准) DTD,文档类型声明: <!Doctype html> 文本编码声明: <meta charset="utf-8" ...

  5. 前端之css样式（选择器）。。。

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

  6. 前端之css样式01

    选择器,css文本属性 CSS语法: 选择器 {属性1: 值1; 属性2: 值2} CSS放置的位置: 1. 直接写在标签里面,通过style属性来设置CSS样式 2. 在head标签里面通过styl ...

  7. 前端学习---css基本知识

    css基本知识 我们先看一个小例子: <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  8. 前端之CSS样式

    一.CSS 1.什么是CSS 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的 ...

  9. 前端之css样式（选择器）

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

随机推荐

  1. 2017-2018-2 20155224『网络对抗技术』Exp8：Web基础

    实践具体要求 Web前端HTML(0.5分) 能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML. Web前端javascipt(0.5分) 理 ...

  2. 20155226《网络攻防》 Exp3 免杀原理与实践

    20155226<网络攻防> Exp3 免杀原理与实践 实验过程 1. msfvenom直接生成meterpreter可执行文件 直接将上周做实验时用msf生成的后门文件放在virscan ...

  3. POJ 1860&&3259&&1062&&2253&&1125&&2240

    六道烦人的最短路(然而都是水题) 我也不准备翻译题目了(笑) 一些是最短路的变形(比如最长路,最短路中的最长边,判环),还有一些就是裸题了. 1860:找环,只需要把SPFA的松弛条件改一下即可,这里 ...

  4. mfc 线程的优先级

    知识点:  线程优先级  获取当前线程句柄  线程优先级设置  线程优先级变动  线程优先级获取 一.线程优先级(Thread priority ) 简单的说就是(线程)的优先级越高,那么就 ...

  5. spring使用 RestTemplate 来进行http访问

    https://www.jianshu.com/p/2b03a812d588 https://my.oschina.net/sdlvzg/blog/1800395 异常:org.springframe ...

  6. [JOI2017春季合宿]Port Facility[set、二分图]

    题意 你有两个栈,有 \(n\) 个货物,每个货物有一个进栈时间和出栈时间(所有时间的并集是1~2n),问有多少种不同的入栈方案. \(n\le 10^6\) 分析 把每个货物的存在看成区间,相交的区 ...

  7. 算法练习-002-返回一个set数组

    题目描述: 写一个函数,它的作用是接受一个整数(假设为num),返回一个数组,数组的长度为num, 数组中的内容为随机的0至(num-1)的值,并且不能重复.比如num为5的话,数组可能是[1,0,3 ...

  8. [Mark]Tomcat/IIS 更改 HTTP 侦听端口

    目的: IIS HTTP 侦听端口改为 8088 Tomcat HTTP 侦听端口改为 80 环境: Windows Server 2012 R2 IIS8.5 (默认端口是 80) Tomcat8. ...

  9. PAT甲题题解-1012. The Best Rank (25)-排序水题

    排序,水题因为最后如果一个学生最好的排名有一样的,输出的课程有个优先级A>C>M>E那么按这个优先级顺序进行排序每次排序前先求当前课程的排名然后再与目前最好的排名比较.更新 至于查询 ...

  10. SCRUM 12.15

    今天我们所有的团队成员都加速的进行着开发.虽然最近3门大作业压着,我们还是抽出了足够多的时间对项目的M2阶段进行完善. 今天我们完成了清除缓存的功能,另外我们的单页爬虫也已经设计完成,我们的进度在我们 ...