标签选择器:

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选择器-常用搜集的更多相关文章

  1. html5--6-11 CSS选择器7--伪类选择器

    html5--6-11 CSS选择器7--伪类选择器 #E:target 选择当前活动的锚点元素. 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候, ...

  2. html5--6-10 CSS选择器7--伪类选择器

    html5--6-10 CSS选择器7--伪类选择器 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓 ...

  3. html5--6-9 CSS选择器6--伪类选择器

    html5--6-9 CSS选择器6--伪类选择器 实例 @charset="UTF-8"; /*:root{background: green}*/ /*li:first-chi ...

  4. html5--6-8 CSS选择器5

    html5--6-8 CSS选择器5 实例 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...

  5. html5--6-7 CSS选择器4

    html5--6-7 CSS选择器4 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...

  6. html5--6-6 CSS选择器3

    html5--6-6 CSS选择器3 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...

  7. html5--6-5 CSS选择器2

    html5--6-5 CSS选择器2 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...

  8. html5--6-4 CSS选择器

    html5--6-4 CSS选择器 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作用 ...

  9. CSS选择器使用

    今天要对CSS选择器的使用方法做一个全面的总结(几乎全部是从这篇文章摘抄的 https://blog.csdn.net/qq_39241986/article/details/82185697) CS ...

随机推荐

  1. 只执行一次的js 函数。

    function runOnce(fn, context) { //控制让函数只触发一次 return function () { try { fn.apply(context || this, ar ...

  2. Manacher算法——求最长回文子串

    首先,得先了解什么是回文串.回文串就是正反读起来就是一样的,如“abcdcba”.我们要是直接采用暴力方法来查找最长回文子串,时间复杂度为O(n^3),好一点的方法是枚举每一个字符,比较较它左右距离相 ...

  3. qq浏览器的用户体验

    用户界面: qq浏览器的用户界面简介,把一些不必要的东西去点,可以很容易让用户找到自己想看的网页,很方便. 记住用户的选择: qq浏览器和QQ相连,可是用QQ账户登录,并且会记住自己访问的高频网页,以 ...

  4. 搜索引擎Elasticsearch,了解一下?

    ElasticSearch介绍 ElasticSearch是一个全文搜索服务器,也可以作为NoSql数据库,存储任意格式的文档和数据,同时可以做大数据的分析.ElasticSearch具有以下特点: ...

  5. css新增UI方案

    一.文本新增样式 opacity 不透明度 h1{ margin: 100px auto; opacity: 0.5; } </style> </head> <body& ...

  6. 【vue】index.html main.js app.vue index.js怎么结合的? 怎么打包的?搜集的信息

    转载:https://blog.csdn.net/yudiandemingzi/article/details/80247137 怎么结合的: 一.启动项目 第一步:cmd进入项目文件里,运行npm ...

  7. Filter2D卷积运算

    图像处理中的卷积运算一般都用来平滑图像.尖锐图像求边缘等等.主要看你选择什么样的核函数了.现在核函数很多,比如高斯平滑核函数,sobel核函数,canny核函数等等.这里举一个sobel核函数的例子来 ...

  8. 第99天:CSS3中透视perspective

    CSS3中透视perspective 透视原理: 近大远小 . 浏览器透视:把近大远小的所有图像,透视在屏幕上. 理解浏览器的坐标系:浏览器平面为 Z=0的平面,坐标原点默认为图片的中心,可以通过更改 ...

  9. C++解析(7):函数重载分析

    0.目录 1.重载的概念 2.C++中的函数重载 3.函数默认参数遇上函数重载 4.编译器调用重载函数的准则 5.重载与指针 6.C++和C相互调用 7.小结 1.重载的概念 自然语言中的上下文--你 ...

  10. poj2299——Ultra-QuickSort

    Description In this problem, you have to analyze a particular sorting algorithm. The algorithm proce ...