CSS---选择器种类 | 层叠性权重】的更多相关文章

一.css选择器种类 1.1,ID选择器 1.2,类选择器 1.3,标签选择器 1.4,后代选择器 1.5,子代选择器 1.6,交集选择器 1.7,并集选择器 1.8,通配符选择器 1.9,属性选择器 1.10,伪类选择器1--LVHA爱恨原则 1.11,伪类选择器2--ntl-child 1.12,伪元素选择器-- before, after 二.css的继承性和重叠性和!important 三.css使用总结 -----------------------------------------…
一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body100%宽度 行级标签 常见的行级标签:a,span,strong,u,em 1.能和其他元素待在同一行2.不能设置宽高3.宽高 是内容的宽高 行内块标签 常见的行内块标签:img,input,textarea1.能和其他元素待在一行2.能设置宽高 span默认是不能设置宽高的,但是设置了displ…
css有两大特性:继承性和层叠性 继承性 面向对象语言都会存在继承的概念,在面向对象语言中,继承的特点:继承了父类的属性和方法.那么我们现在主要研究css,css就是在设置属性的.不会牵扯到方法的层面. 继承:给父级设置一些属性,子级继承了父级的该属性,这就是我们的css中的继承. 记住:有一些属性是可以继承下来 : color . font-*. text-*.line-* .主要是文本级的标签元素. 但是像一些盒子元素属性,定位的元素(浮动,绝对定位,固定定位)不能继承. 层叠性 层叠性:…
假如同一个标签被多个选择器选中,每个选择器都设置了相同的样式,浏览器中加载时这个样式听谁的? 不同选择器设置的同一个样式,只会选择一个进行加载,不会叠加. 为了解决听谁的问题,引入层叠性的概念. 层叠性:多个选择器选中同一个标签,设置同一个样式,浏览器中加载时,不会加载所有的属性值,挑选其中一个加载,其中一个值层叠/覆盖掉其他的值.   要实现层叠或覆盖就涉及到比较,下面就是比较选择器之间的权重的比较,权重的比较一共有两种情况:1.选择器选中了标签:2.选择器没有选中标签 首先说一下选择器的权重…
1.1 继承性 有一些属性,当给自己设置的时候,自己的后代都继承上了,这个就是继承性. 哪些属性能继承? color. text-开头的.line-开头的.font-开头的. 这些关于文字样式的,都能够继承: 所有关于盒子的.定位的.布局的属性都不能继承. 所以,如果我们的页面的文字,都是灰色,都是14px.那么就可以利用继承性: 1 body{ 2 color:gray; 3 font-size:14px;4 } 继承性是从自己开始,直到最小的元素. 1.2 层叠性 CSS异常冲突处理能力--…
一. 继承性    1. 含义:从自己开始直到所包裹的最小的元素,都可以继承一些特有的属性.    2. 作用范围:  a. color.text-开头的.line-开头的.font-开头的,均可以继承. b. 文字样式的,都能继承:所有关于盒子的.定位的.布局的都不能继承.    3. 实例: 二. 层叠性    1. 背景:当多个选择器同时关系到某一个标签的时候,样式以谁为准,这时牵扯层叠性,权重问题.    2. 含义:就是CSS解决冲突的能力.(所有的权重计算,没有任何兼容性问题).  …
1.继承性 <style type="text/css"> .father{ font-size: 30px; background-color: green; } .child{ color: purple; } </style> </head> <body> <!-- 继承:给父级设置一些属性,子级继承了父级的该属性,这就是我们的css中的继承 有一些属性是可以继承下来 : color . font-*. text-*.line…
1.CSS选择器优先级:    !important >行间样式> id >class和属性选择器>标签选择器>通配符选择器        注意:[初级工程师水平] 2.之所以有优先级问题,归根到底是这些选择器有权重的,权重值越大,优先级越高!如下所示: !important                              Infinity[正无穷]          行间选择器                            1000[权重]        …
CSS有两大特性:继承性和层叠性 前端 CSS的继承性 前端 CSS层叠性 CSS选择器优先级 前端 CSS 优先级 样式设置important…
目录 css权重值(重叠性)实例 权重值的计算 !important 提升权重值实例 什么情况下可以使用!important ? 总结: css权重值(重叠性)实例 css中有很多选择器,那在多个选择器都作用于同一个元素的情况下会出现什么效果呢? 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title></tit…