css三种样式表优先级,css三种样式表优先级不一样

19、css样式的优先级

1、最近的祖先样式比其他祖先样式优先级高。

2、"直接样式"比"祖先样式"优先级高。

首先，我们需要知道有哪些选择器：

1）ID 选择器， 如 #id{}

2）类选择器， 如 .class{}

3）属性选择器， 如 a[href="segmentfault.com"]{}

4）伪类选择器， 如 :hover{}

5）伪元素选择器， 如 ::before{}

6）标签选择器， 如 span{}

7）通配选择器， 如 *{}

3、内联样式 ID 选择器 类选择器 = 属性选择器 = 伪类选择器 标签选择器 = 伪元素选择器

4、当一个标签同时被多个选择符选中，我们便需要确定这些选择符的优先级。我们有如下规则：计算选择符中 ID 选择器的个数（a），计算选择符中类选择器、属性选择器以及伪类选择器的个数之和（b），计算选择符中标签选择器和伪元素选择器的个数之和（c）。按 a、b、c 的顺序依次比较大小，大的则优先级高，相等则比较下一个。若最后两个的选择符中 a、b、c 都相等，则按照"就近原则"来判断。

5、属性后插有 !important 的属性拥有最高优先级。若同时插有 !important，则再利用规则 3、4 判断优先级。

相关问答

Q1: 简述3种常用的css样式表及优先级顺序

css只负责静态样式，无法做任何逻辑运算，如果需要随机背景，需要js配合使用

// 首先，定义一个数组，用于存放所有的背景图片

var arr = new Array();

// 将所有背景图放入arr内

arr.push('背景图地址', '背景图地址', '背景图地址');

// 随机获得一个键值

var bg = Math.floor((Math.random() * arr.length));

// 将背景图片放入body的css中

$('body').css('background-image', arr[bg]);

Q2: css样式引入有哪几种方式,优先级是怎么样的？

按优先级：前端优先读取正序。正规规范优先倒序。

style= 这样肯定是最优的，但也是最不推荐的。前端标签直接写入。

延伸阅读：读取优先，灵活使用，如大量页面，每页面都要设置。工作繁琐，大量写入增加代码量。不利优化。

style type="text/css" 这样属于第二读取方式。直接写在对应的页面。

延伸阅读：每页面都要设置。工作繁琐，大量写入增加代码量。不利优化。

link type="text/css" href=" 引用CSS文件 第三级。这全局引入.

延伸阅读：全局CSS。可以分离代码及外部引入，简单快捷。也是现在都在用的。