前端八股文 说一说样式优先级的规则是什么?

标准的回答

CSS样式的优先级应该分成四大类
第一类 !important:
😄无论引入方式是什么,选择器是什么,它的优先级都是最高的。
第二类 引入方式:
😄行内样式的优先级要高于嵌入和外链,嵌入和外链如果使用的选择器相同就看他们在页面中插入的顺序,在后面插入的会覆盖前面的。
第三类 选择器
😄选择器优先级:id选择器>(类选择器 | 伪类选择器 | 属性选择器 )> (后代选择器 | 伪元素选择器 )> (子选择器 > | 相邻选择器) > 通配符选择器 。
第四类 继承样式
😄是所有样式中优先级比较低的。
第五类 浏览器默认样式
😄优先级最低

加分回答:

1.使用!important要谨慎:
① 定要优先考虑使用样式规则的优先级来解决问题而不是 !important
② 只有在需要覆盖全站或外部 CSS 的特定页面中使用 !important
③ 永远不要在你的插件中使用 !important
④ 永远不要在全站范围的 CSS 代码中使用 !important

2.优先级的比较 指的是相同的样式属性,不同样式属性优先级比较失效
比如:在设置max-width时注意,已经给元素的max-width设置了!important但是还不生效,很有可能就是被width覆盖了
举例:div最终的宽度还是200px

div { max-width: 400px !important; height: 200px;background-color: tomato; width: 200px; 
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/866527.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++11|左、右值引用和移动语义

目录 一、左值引用 && 右值引用 1.1什么是左值?什么是左值引用? 1.2什么是右值?什么是右值引用? 1.3左值引用与右值引用比较 二、左、右值引用使用场景(为什么要有右值引用?) 2.1左值引用使用场景: 2.2右…

秋招突击——设计模式补充——简单工厂模式和策略模式

文章目录 引言正文简单工厂模式策略模式策略模式和工厂模式的结合策略模式解析 总结 引言 一个一个来吧,面试腾讯的时候,问了我单例模式相关的东西,自己这方面的东西,还没有看过。这里需要需要补充一下。但是设计模式有很多&…

数字IC设计-VCS和Verdi的使用

#学习记录# 前言:本文以一个简单的计数器来说明vcs和verdi的使用 1 代码文件 1.1 计数器代码 //Engineer:Mr-pn-junction module counter(input clk,input rst,output reg [5:0] count); always(posedge clk or negedge rst)beginif(!rst)coun…

【算法】(C语言):二分查找

二分查找: 获取查找区域的中间位置。若中间位置的数据就是要找的值,则返回true。若要找的值 小于 中间位置的数据,则往左边查找。若要找的值 大于 中间位置的数据,则往右边查找。重复1和2,若没有要找的值,…

业界数据架构的演变

目录 一、概述 二、业务处理-单体架构 三、业务处理-微服务架构 四、数据分析-大数据Lambda架构 五、数据分析-Kappa架构 六、数据分析-LambdaKappa混合架构 七、湖仓一体架构 一、概述 近年来随着越来越多的大数据技术被开源,例如:HDFS、Spark等…

【Linux进程通信】共享内存

目录 共享内存函数 头文件 shmget ftok函数​ shmat shmdt shmctl 共享内存区是最快的IPC 形式。一旦这样的内存映射到共享它的进程的地址空间,这些进程间数据传递不再涉及到操作系统内核,换句话说是进程不再通过执行进入内核的系统调用来传递彼此的数据…

《向量数据库指南》——Milvus Cloud查询增强如何提升 RAG Pipeline 效果?

查询增强 1.假设性问题 这一方法首先使用LLM为每一条文档块生成一些假设问题,这些文档块可以回答与之对应的假设问题。在RAG阶段,进行一个query-to-query的搜索,先搜索到相关的假设问题,然后找到对应的文档块,再通过它们生成最后的回答。 这里的query-to-query指的是embed…

【数据库】仓库管理数据库(练习样例)

某连锁超市需要设计实现一个仓库管理系统,要求每个仓库可以有多名仓库管理员,每个仓库管理员只负责管理一个仓库,同时每个仓库都配备了一名仓库主管;不同的仓库存放的是不同类型的货品,每种货品只存放在固定的仓库中&a…

R语言数据分析案例40-华安中证基金多元线性回归和分析预测

一、引言 基金是一种非常受欢迎的投资工具,由于其具有风险分散、专业管理等特点,越来越多的投资者选择将资金投入基金市场。然而,基金的表现却受到很多因素的影响,如股票市场的整体表现、基金管理人员的能力、基金规模、基金管理…

二二复制模式,发展下属并形成一个销售网络体系来实现收入增长!

二二复制模式,又称为双轨制,是一种直销理念的营销模式,其核心在于通过发展下属并形成一个销售网络体系来实现收入增长。以下是对二二复制模式的详细讲解,包括其优势和玩法介绍,以及适合的行业。 一、二二复制模式的定…

Flutter集成高德导航SDK(Android篇)(JAVA语法)

先上flutter doctor: flutter sdk版本为:3.19.4 引入依赖: 在app的build.gradle下,添加如下依赖: implementation com.amap.api:navi-3dmap:10.0.700_3dmap10.0.700navi-3dmap里面包含了定位功能,地图功能…

香橙派AIpro开发板评测:部署yolov5模型实现图像和视频中物体的识别

OrangePi AIpro 作为业界首款基于昇腾深度研发的AI开发板,自发布以来就引起了我的极大关注。其配备的8/20TOPS澎湃算力,堪称目前开发板市场中的顶尖性能,实在令人垂涎三尺。如此强大的板子,当然要亲自体验一番。今天非常荣幸地拿到…

边界无限陈佩文:红蓝对抗安全演练常态化的各方分析

虽然常态化演练尚未正式开始,但我们仍然希望对各方的表现进行一些分析和预测,以辅助我们对市场的判断和决策。同时,也希望通过这些初步的见解,抛砖引玉,引发更多有价值的讨论和观点。 “船停在码头是最安全的&#xf…

Hi3861 OpenHarmony嵌入式应用入门--SNTP

sntp(Simple Network Time Protocol)是一种网络时间协议,它是NTP(Network Time Protocol)的一个简化版本。 本项目是从LwIP中抽取的SNTP代码; Hi3861 SDK中已经包含了一份预编译的lwip,但没有…

线程间的通信

文章目录 线程间的通讯技术就是通过等待和唤醒机制,来实现多个线程协同操作完成某一项任务,例如经典的生产者和消费者案例。等待唤醒机制其实就是让线程进入等待状态或者让线程从等待状态中唤醒,需要用到两种方法,如下&#xff1a…

红蓝对抗下的内网横向移动渗透技术详解

一、利用Windows计划任务横向移动 Windows计划任务是一个非常实用的功能,可以帮助我们自动完成一些重复性的任务。比如,我们可以设定一个计划任务来自动备份文件、更新软件、执行脚本等,本文主要介绍了如何利用Windows计划任务进行横向渗透。 &#xf…

C#委托事件的实现

1、事件 在C#中事件是一种特殊的委托类型,用于在对象之间提供一种基于观察者模式的通知机制。 1.1、事件的发送方定义了一个委托,委托类型的声明包含了事件的签名,即事件处理器方法的签名。 1.2、事件的订阅者可以通过运算符来注册事件处理器…

Python基础小知识问答系列-过滤列表元素

1. 问题: 如何根据单一条件过滤列表的元素? 如何根据复杂条件过滤列表的元素? 2. 解决方式: 可以使用推导式生成器,进行单一条件的列表元素过滤,尤其是列表内容较多时; 也可以使用filter函数进行列…

Linux Static Keys和jump label机制

文章目录 前言一、asm goto二、API使用2.1 低版本API2.2 高版本API 三、jump label四、源码分析4.1 数据结构4.2 static_key_false4.3 jump_label_init4.4 __jump_label_transform4.5 static_key_slow_inc/dec 五、__jump_table节5.1 内核5.2 内核模块 六、修改内存代码6.1 x86…

24西安电子科技大学数学与统计学院—考研录取情况

24西安电子科技大学—数学与统计学院—考研录取统计 01、数学与统计学院各个方向 02、24数学与统计学院近三年复试分数线对比 数统院24年院线相对于23年院线增加高达30分,确实增长浮动比较高,接近30分的水平,因此大家更需要好好去努力&#x…