css的特性
一、继承性:
继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代。
/* 不具有继承性的css样式: */
p{border:1px solid red;}
二、特殊性(优先级?)
定位一个元素,选择器的特殊性值则是决定哪一个胜出的关键。 其形式(不在代码中体现)如:0,0,0,1/1,1,0,1/0,0,0,3/….
主要有四个规则:
- 用了ID ,则 +0,1,0,0;
- 用class、属性(如[id=”btn1”])、伪类(如:hover) +0,0,1,0;
- 元素和伪元素(如::before) 加0,0,0,1;
- 结合符对特殊性没有贡献,而通配符的贡献是0,0,0,0.(所以他们对总特殊性没有影响);
几个例子:
p{font-style: normal} /* 0,0,0,1 */
body div p{font-style:italic} /* 0,0,0,3 */(winner)
html > body table tr[id="totals"] td ul > li{color:maroon;} /* 0,0,1,7 */
li#answer {color: navy} /* 0,1,0,1 /* (winner)
题外话:css中 内联样式(直接写在标签中的) > 嵌入样式(写在<head></head>中的) > 外部样式(<link></link>导入的)
三、层叠
后面的样式会覆盖前面的样式
四、总结
内联样式>id>class;
如果特殊性相同,后定义的规则优先;
css的特性的更多相关文章
- CSS.02 -- 样式表 及标签分类(块、行、行内块元素)、CSS三大特性、背景属性
样式表书写位置 内嵌式写法 <head> <style type="text/css"> 样式表写法 </style> </head&g ...
- Css - 三大特性
css - 三大特性 1.层叠性 如果通过两个相同选择器设置了同一个元素的某个相同的css属性,按照css相同属性的出现顺序,后面的样式会覆盖前面的样式 2.继承性 祖先元素的关于文本的样式会遗传给后 ...
- CSS三大特性(继承、优先级、层叠)之个人见解
首先声明一下CSS三大特性——继承.优先级和层叠.继承即子类元素继承父类的样式,比如font-size,font-weight等f开头的css样式以及text-align,text-indent等t开 ...
- 2017 css新特性
2017年要学习的三个CSS新特性 这是翻译的一篇文章,原文是:3 New CSS Features to Learn in 2017,翻译的不是很好,如有疑问欢迎指出. 新的一年,我们有一系列新的东 ...
- python 之 前端开发(CSS三大特性、字体属性、文本属性、背景属性)
11.38 css三大特性 11.381 继承性 1.定义:给某一个元素设置一些属性,该元素的后代也可以使用,这个我们就称之为继承性2.注意: 1.只有以color.font-.text-.l ...
- CSS 三大特性 层叠 继承 优先级
css三大特性 层叠性: 如果一个属性通过两个相同选择器设置到同一个元素上,相同的属性就会出现冲突,那么这个时候一个属性就会将另一个属性层叠掉,采用的是就近原则 继承性: 子标签会继承父标签的某些样式 ...
- 2017年学习的三个CSS新特性
这是翻译的一篇文章,原文是:3 New CSS Features to Learn in 2017,翻译的不是很好,如有疑问欢迎指出. 新的一年,我们有一系列新的东西要学习.尽管CSS有很多新的特性, ...
- 【译】2017年要学习的三个CSS新特性
这是翻译的一篇文章,原文是:3 New CSS Features to Learn in 2017,翻译的不是很好,如有疑问欢迎指出. 新的一年,我们有一系列新的东西要学习.尽管CSS有很多新的特性, ...
- 2017年要学习的三个CSS新特性
这是翻译的一篇文章,原文是:3 New CSS Features to Learn in 2017,翻译的不是很好,如有疑问欢迎指出. 新的一年,我们有一系列新的东西要学习.尽管CSS有很多新的特性, ...
- CSS之特性相关
一.css的继承性与层叠性 继承性: 面向对象语言都会存在继承的概念,在面向对象语言中,继承的特点:继承了父类的属性和方法.那么我们现在主要研究css,css就是在设置属性的.不会牵扯到方法的层面. ...
随机推荐
- robotframework日志中文乱码,编译提示‘utf-8’ codecxxxx。
1.需要设置robotframework的语系 2.设置完后,需要重启robotframework才生效.它比较特别,什么改变都要重启才生效
- P2257 YY的GCD--洛谷luogu
传送门 题目描述 神犇YY虐完数论后给傻×kAc出了一题 给定N, M,求1<=x<=N, 1<=y<=M且gcd(x, y)为质数的(x, y)有多少对 kAc这种傻×必然不 ...
- DAO层基础设计原理
在实际的开发中有一种项目的程序组织架构方案叫做MVC模式,按照程序 的功能将他们分成三个层,如下图 Modle层(模型层).View层(显示层).Controller层(控制层). Modle层:可以 ...
- [MicroPython]TurnipBit开发板旋转按钮控制直流电机转速
1.实验目的: 学习在PC机系统中扩展简单I/O 接口的方法 学习TurnipBit拼插编程 了解直流电机的工作原理 学习L298N的工作原理 学习TurnipBit扩展板L298N和按键模块的接线方 ...
- C学习笔记-一些知识
memset可以方便的清空一个结构类型的变量或数组. 如: struct sample_struct { ]; int iSeq; int iType; }; 对于变量 struct sample_s ...
- node express 静态资源
实例代码 const express = require('express') const path = require('path') const app = express() app.use(e ...
- hibernate异常找不到get方法org.hibernate.PropertyNotFoundException: Could not find a getter for did in class com.javakc.hibernate.manytomany.entity.CourseEntity
属性的get方法没找到,可能是CourseEntity类中对应属性没有get方法,如果有就看CourseEntity.hbm.xml属性名称,应该是写错了不和CourseEntity类中属性名相同,修 ...
- linux 下mysql服务的管理
一.mysql服务的管理 1.1 mysql启动与关闭 linux下启动mysql: /etc/init.d/mysqld start 关闭进程: ps -ef | grep mysql 找到进程号 ...
- 我们为什么要使用List和Set(List,Set详解)
1.集合概述 类图 集合和数组的区别? 集合基本方法 集合特有的遍历方式? public static void main(String[] args) { //创建集合对象 Collection c ...
- echarts使用笔记二:柱子堆叠
1.多个柱子堆叠效果,多用于各部分占比 app.title = '坐标轴刻度与标签对齐'; option = { title : { //标题 x : 'center', y : 5, text : ...