前端学习 -- Css -- 样式的继承
像儿子可以继承父亲的遗产一样，在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 -- 样式的继承的更多相关文章
- CSS样式表继承详解
最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...
- 前端04 /css样式
前端04 /css样式 目录 前端04 /css样式 昨日内容回顾 css引入 选择器 基础选择器 组合选择器 属性选择器 伪类选择器 伪元素选择器 优先级(权重) 通用选择器 css样式 1高度宽度 ...
- vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记（一） web攻击 web安全之XSS JSONP && CORS css 定位 react小结
vue—你必须知道的 目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...
- 前端学习——css基础知识，选择器与html模板、值得收藏的html标签
一.css需要的html(采用html5标准) DTD,文档类型声明: <!Doctype html> 文本编码声明: <meta charset="utf-8" ...
- 前端之css样式（选择器）。。。
一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...
- 前端之css样式01
选择器,css文本属性 CSS语法: 选择器 {属性1: 值1; 属性2: 值2} CSS放置的位置: 1. 直接写在标签里面,通过style属性来设置CSS样式 2. 在head标签里面通过styl ...
- 前端学习---css基本知识
css基本知识 我们先看一个小例子: <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- 前端之CSS样式
一.CSS 1.什么是CSS 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的 ...
- 前端之css样式（选择器）
一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...
随机推荐
- kettle学习笔记（一）——入门与安装
一.概述 1.kettle是什么 Kettle是一款国外开源的ETL工具,纯java编写,可以在Window.Linux.Unix上运行,绿色无需安装,数据抽取高效稳定.中文名称叫水壶,该项目的主程序 ...
- Hadoop日记Day6---Linux的常用命令
一.系统操作(开机.关机.登陆等)命令 选项名称 使用格式 含义 reboot 输入回车即可 立刻重启 shutdown shutdown –r now 立刻重启 shutdown –r 20: ...
- CodeForces-1155D Beautiful Array
Description You are given an array \(a\) consisting of \(n\) integers. Beauty of array is the maximu ...
- android全屏
this.requestWindowFeature( Window.FEATURE_NO_TITLE ); this.getWindow().setFlags(WindowManager.Layout ...
- [Mark]Tomcat/IIS 更改 HTTP 侦听端口
目的: IIS HTTP 侦听端口改为 8088 Tomcat HTTP 侦听端口改为 80 环境: Windows Server 2012 R2 IIS8.5 (默认端口是 80) Tomcat8. ...
- 设计模式 笔记 装饰模式 Decorator
//---------------------------15/04/17---------------------------- //Decorator 装饰模式----对象结构型模式 /* 1:意 ...
- web项目_学生证管理系统
项目简述: 基于java web实现学生卡管理系统,用户包括学生和学生处,分别实现以下功能. 学生: 1.对本人登录密码的修改 2.申请补办学生卡 3.查看学生卡补办状态 学生处: 1.对学生信息的管 ...
- Jq_浏览器兼容性及其浏览器版本
JQuery 中用 方法 jQuery.browser 来判断浏览器,返回值可以为: safari opera msie mozilla. 当然有时候我们还需要区分版本 这就要用到 jQuery.br ...
- A1020. Tree Traversals(25)
这是一题二叉树遍历的典型题,告诉我们中序遍历和另外一种遍历序列,然后求任何一种遍历序列. 这题的核心: 建树 BFS #include<bits/stdc++.h> using names ...
- [T-ARA][결혼 하지마][不要结婚]
歌词来源:http://music.163.com/#/song?id=27808773 作曲 : 二段横踢 [作曲 : 二段横踢] 作词 : 二段横踢 [作词 : 二段横踢] Hey anybody ...