CSS选择器-常用搜集
标签选择器:
div{
font-size=10px;
color=red;
background-color=yello;
width=200px;
height=200px;
}
<div>前端威武</div>
---------------------------------------
类选择器:
.box{
}
<p class="box">啊啊啊啊</p>
------------------------------------------
ID选择器:
#box{
}
<p id="box">啊啊啊<p>
-------------------------------------------
通配符选择器
*{
}
<div>aa</div>
<p>aaa</p>
---------------------------------
复合选择器:两个或两个以上的选择器通过不同方式连接起来
div.box{//无空格
color:red;
}
<div class="box">哎哎</div>//这个div里的box变红色
<p class="box">aaa<p>
<div>aaaaaa</div>
-------------------------------
后代选择器:有空格 无限制隔代
选择器+空格+选择器.....{
}
.box san{
cocor:red;
}
<div class="box">
<p><span class="miss">aa</span></p>
</div>
----------------------------------
子代选择器:
div>span{
color;red;
}
<div>
<p><span></span></p>//这里的span是孙子 这里是p>span
<span></span> //直接的子标签变了就是这个
------------------------------------------------------------------------
并集选择器:
div,p,span{
font-size:100px;
}
<div>aaa</div>
<p>aaa</p>
<span>aaaa</span>
------------------------------------
选择器优先级:
一、什么是css优先级
css优先级,即是指CSS样式在浏览器中被解析的先后顺序。
二、css优先级规则
比较简单易记的一种方法就是给不同选择器分配不同的值:
1.id选择器默认优先级最高,其权值为100
2.class选择器、属性选择器和伪类选择器的权值为10
3.标签选择器的优先级较低,其权值为1
所以在比较样式的优先级时,只需统计选择符中的id、class、标签名个数,然后把对应的权值相加即可。根据结果便可得出优先级高低。
1.结果较大的优先级较高
2.结果相同,则后定义的样式优先级较高
3.如果样式值中含有!important,则该值优先级最高
CSS选择器-常用搜集的更多相关文章
- html5--6-11 CSS选择器7--伪类选择器
html5--6-11 CSS选择器7--伪类选择器 #E:target 选择当前活动的锚点元素. 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候, ...
- html5--6-10 CSS选择器7--伪类选择器
html5--6-10 CSS选择器7--伪类选择器 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓 ...
- html5--6-9 CSS选择器6--伪类选择器
html5--6-9 CSS选择器6--伪类选择器 实例 @charset="UTF-8"; /*:root{background: green}*/ /*li:first-chi ...
- html5--6-8 CSS选择器5
html5--6-8 CSS选择器5 实例 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...
- html5--6-7 CSS选择器4
html5--6-7 CSS选择器4 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...
- html5--6-6 CSS选择器3
html5--6-6 CSS选择器3 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...
- html5--6-5 CSS选择器2
html5--6-5 CSS选择器2 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...
- html5--6-4 CSS选择器
html5--6-4 CSS选择器 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作用 ...
- CSS选择器使用
今天要对CSS选择器的使用方法做一个全面的总结(几乎全部是从这篇文章摘抄的 https://blog.csdn.net/qq_39241986/article/details/82185697) CS ...
随机推荐
- 扩展Lucas定理 扩展Lucas板子
题意概述:多组询问,给出N,K,M,要求回答C(N,K)%M,1<=N<=10^18,1<=K<=N,2<=M<=10^6 分析: 模数不为质数只能用扩展Lucas ...
- php异步学习(1)
1.为啥PHP需要异步操作? 一般来说PHP适用的场合是web页面展示等耗时比较短的任务,如果对于比较花时间的操作如resize图片.大数据导入.批量发送EDM.SMS等,就很容易出现操作超时情况.你 ...
- daterangepicker时间段插件
1.序言: daterangepicker是Bootstrap的一个时间组件,使用很方便 用于选择日期范围的JavaScript组件. 设计用于Bootstrap CSS框架. 它最初是为了改善报表而 ...
- 6. B树
一.B 树是一种多叉平衡查找树 相较于二叉结构的红黑树,B 树是多叉结构,所以在元素数量非常多的情况下,B 树的高度不会像二叉树那么大,从而保证查询效率. 一棵含 n 个结点的 B 树的高度 h = ...
- 用VS测试程序
怀着一种忐忑的心情,我开始了我的软件测试. #include "stdio.h" #include "stdlib.h" int main(int argc, ...
- 大学网站UI设计分析(以学校领导/历届领导为例)
第一次的冲刺阶段让我过了一把PM的瘾,第一阶段的冲刺完成以后第一感觉就是PM不好当,在大学里做个课程设计当个PM相对而言还是比较容易的,但是我明白,当我们走向工作岗位以后,面临的情况会比学校的情况的复 ...
- Alpha 冲刺(9/10)
队名 火箭少男100 组长博客 林燊大哥 作业博客 Alpha 冲鸭鸭鸭鸭鸭鸭鸭鸭鸭! 成员冲刺阶段情况 林燊(组长) 过去两天完成了哪些任务 协调各成员之间的工作 多次测试软件运行 学习OPENMP ...
- struts2 不返回result的做法
有时候 比如提交一个弹框的表单 提交成功后我们只是让表单关闭并不进行页面跳转,那么action 里面就returne null, 然后result 也不用配置了 版权声明:本文为博主原创文章,未经博主 ...
- .NET Core 控制台中文乱码问题!
class Program { static void Main(string[] args) { Encoding.RegisterProvider(CodePagesEncodingProvide ...
- 【php】session读写锁
事件:a文件中操作$_SESSION['start'] = 'yes'; sleep(100); 休眠100s 在这休眠的时间段中,b文件操作$_SESSION['start'] = 'no'; 结 ...