使用 all: unset 或 all: revert 会重置哪些属性？对继承属性有何影响？
围绕“使用 all: unset 或 all: revert 会重置哪些属性？对继承属性有何影响”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 all 快捷重置所有属性，unset 会恢复为继承值或初始值，revert 回退到用户代理。
核心关键词CSS all property unset revert
面试知识索引 · 分类、标签与搜索
层叠与选择器专题面试题，43 道完整答案
层叠与选择器专题面试题第 1 页，显示第 1–43 题，共找到 43 道完整解析，可继续按分类、标签与关键词缩小范围。
43筛选结果
52技术分类
178检索标签
1索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
技术分类52 个
全部分类5000AI Agent511浏览器301JavaScript285React281AI 开发262CSS240Node.js217TypeScript206Vue180前端工程化138React Native135
查看全部 52 个分类
热门标签178 个
查看其余 163 个标签
网络协议111测试109数据库事务95实时通信92Web 可访问性90动画79可观测性77Agent 记忆75向量检索66工具调用66LangGraph59Prompt56任务规划53排障与运维53数据库索引52浏览器自动化51Flexbox50值与类型50GraphQL49事务与并发49构建与镜像49DNS 与 TLS48工程协作与交付48AI 评测47CSS Grid47Express 服务47MCP47副作用与同步47向量与嵌入47文件与多媒体47流与二进制47传输与协议46列表与性能46可维护代码46响应式原理46容器运行46指标日志追踪46数据建模与运维46文件与 I/O46表单与输入46MCP 协议45RAG45Vite 与模块构建45Webpack45内存与虚拟化45原生集成45多 Agent45工作负载与发布45应用与性能45数据处理45模块与工具链45组件与模板45缓存与数据结构45网络与运维45评估与调试45身份认证与授权45运行时与开发45Web 系统方案44一致性与容错44侦听与生命周期44分布式使用44原生组件与交互44可访问交互44消息与异步处理44渲染与调度44索引与执行计划44组件设计44缓存与代理44进程与并发44攻击面与防御43文档数据库43权限与安全43离线与渐进增强43语义与文档43请求与通信 API43Worker 与线程协作42事件系统42存储与离线数据42服务架构42服务端与流式渲染42服务端工程42泛型设计42版本控制42类型收窄42类型运算42组件与端到端42编码与执行42进程与线程42DOM 与文档操作41Flex 布局41HTTP 语义41NestJS 架构41REST 与接口契约41SQL 查询41加载与交互性能41动画与视觉41类型工程41记忆与状态41运行时与调度41Agent 架构40WebAssembly 集成40单元与集成测试40多 Agent 协作40工作流编排40模块与语言机制40浏览器与 UI 自动化40生产运行40函数与作用域39响应式设计39性能与并发39类型系统基础39Grid 布局38数组与集合38盒模型与排版38Hooks 与复用37应用开发37推理与成本37状态共享37知识库数据37模型与应用评测36对象与原型35状态与渲染35语言与并发35异步与 Promise34Effect32RAG 检索31React 性能31响应式与性能31微调与数据31TanStack Query30全栈边界30数据与缓存30大模型基础29路由与数据流29事件循环28流式交互28提示与上下文设计27数据与服务端27组件与依赖注入27组件与响应式27多模态应用24应用与渲染24Hydration22沙箱安全22状态管理18算法18CI/CD13语言与运行时10React Server Components6搜索与排序4实用函数实现3链表栈队列3图算法2字符串算法2树与遍历2索引与高级结构2Kubernetes1作用域与函数1动态规划1异步与浏览器1手写与交互性能1数组与双指针1相等比较1
第 1 页
本页面试问题
按稳定语义路径排序
- 0001
- 0002
可否在 @media 内定义 @layer？如果可以，其作用域如何影响层叠？
围绕“可否在 @media 内定义 @layer？如果可以，其作用域如何影响层叠”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要明确可以，但会影响条件规则，但普遍浏览器支持？需要说明浏览器版本，不深入其他 at-rules。
核心关键词CSS @layer inside @media rules - 0003
自定义属性在继承方面有哪些特殊性？例如，它们默认是否继承？
本文解释自定义属性（CSS变量）的继承行为：默认可继承、可被后代覆盖、并说明 initial 和 unset 的影响，与普通属性对比。
核心关键词CSS custom property inheritance behavior - 0004
如何让自定义属性参与过渡动画？需要满足哪些条件？
围绕“如何让自定义属性参与过渡动画？需要满足哪些条件”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明需要注册属性（如@property）并指定初始值，或值类型已知，且过渡代理，不深入到注册方式细节。
核心关键词CSS custom property transition animation - 0005
仅设置自定义属性为无效值时，例如 color: var(--x) 但 --x 不是合法颜色，最终效果如何？
围绕“仅设置自定义属性为无效值时，例如 color: var(--x) 但 --x 不是合法颜色，最终效果如何”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要区分自定义属性继承有效但使用该值的属性变为无效，可能回落继承或 initial。
核心关键词CSS custom property invalid at computed-value time - 0006
CSS 自定义属性的作用域如何限定到特定组件？有哪些推荐模式？
围绕“CSS 自定义属性的作用域如何限定到特定组件？有哪些推荐模式”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需提出利用后代选择器或作用域伪类，但避免污染全局，同时不深入 Shadow DOM 细节。
核心关键词CSS 自定义属性 组件作用域 实践 - 0007
动态伪类 :hover 和 :focus 在使用时有哪些注意事项？例如触屏设备上的行为。
围绕“动态伪类 :hover 和 :focus 在使用时有哪些注意事项？例如触屏设备上的行为”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需提及鼠标悬停和键盘焦点，以及 :focus-visible 的差别。
核心关键词CSS :hover :focus dynamic pseudo-class - 0008
::first-line 伪元素能对哪些类型的元素生效？为什么对块级和行内元素会有差异？
围绕“::first-line 伪元素能对哪些类型的元素生效？为什么对块级和行内元素会有差异”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需指出只对块容器内第一行有效，但 flex 和 grid 容器中不起作用，说明理由。
核心关键词CSS ::first-line pseudo-element applicability - 0009
:has() 伪类为什么被称为“父选择器”？它的引入对 CSS 选择器有哪些影响？
围绕“:has() 伪类为什么被称为“父选择器”？它的引入对 CSS 选择器有哪些影响”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释能选择包含某子元素的元素，以及性能注意。
核心关键词CSS :has() relational pseudo-class - 0010
当同时存在带 !important 和不带 !important 的规则时，默认的层叠优先级顺序是什么？
CSS !important 优先级怎么排？解释普通与重要声明的来源顺序、@layer 反转规则、内联样式和动画过渡的边界，并用可运行 HTML 示例定位样式冲突。
核心关键词CSS !important cascade precedence order - 0011
请比较 inherit、initial、unset 在可继承和不可继承属性上的表现有何不同？
本文通过对比 inherit、initial、unset 在可继承与不可继承属性上的差异，解释 unset 的动态等价规则，并给出工程场景与边界。
核心关键词CSS inherit initial unset inheritance - 0012
在实战中，何时适宜用 inherit 关键字来强制子元素继承父属性？
围绕“在实战中，何时适宜用 inherit 关键字来强制子元素继承父属性”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需举例说明如按钮重置字体颜色，但不应滥用。
核心关键词CSS inherit 关键字 实际使用场景 - 0013
当父元素定义了某个可继承属性，子元素自身也有相同属性时，如何判定子元素的最终值？
围绕“当父元素定义了某个可继承属性，子元素自身也有相同属性时，如何判定子元素的最终值”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明子元素自身规则（哪怕优先级低）优先于继承值，且若无自身规则，继承值参与层叠。
核心关键词CSS 继承属性 子元素覆盖 最终值 - 0014
:is() 和 :where() 在优先级上有何关键差异？它们适合在哪些场景使用？
围绕“:is() 和 :where() 在优先级上有何关键差异？它们适合在哪些场景使用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需明确 :is() 取最高优先级，:where() 为零，并给出示例。
核心关键词CSS :is() vs :where() specificity - 0015
当未使用 @layer 的全局样式与 @layer 中的样式冲突时，谁优先级更高？
围绕“当未使用 @layer 的全局样式与 @layer 中的样式冲突时，谁优先级更高”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明未分层的样式优先级高于任何分层样式，除非分层中带 !important。
核心关键词CSS unlayered styles override layered - 0016
请解释 @layer 的作用，并简要说明如何定义层叠层以及默认顺序的影响。
围绕“请解释 @layer 的作用，并简要说明如何定义层叠层以及默认顺序的影响”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 @layer 可以分组规则并控制优先级，未指定顺序时按出现顺序，但常用顺序需指定。
核心关键词CSS @layer cascade layer - 0017
在带 !important 时，层叠层的优先级顺序会如何反转？
围绕“在带 !important 时，层叠层的优先级顺序会如何反转”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明正常情况下靠后的层优先，但带 !important 时靠前的层优先，这是常见的误区。
核心关键词CSS cascade layer !important reverse order - 0018
假设存在多个 @layer 语句，各层多次出现时其最终顺序如何确定？
围绕“假设存在多个 @layer 语句，各层多次出现时其最终顺序如何确定”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明浏览器按第一次出现的顺序确定，后续语句只追加规则。
核心关键词CSS @layer multiple statements order - 0019
如果两个规则来自不同层叠层但优先级相同，决定胜负的是层顺序还是层内顺序？
围绕“如果两个规则来自不同层叠层但优先级相同，决定胜负的是层顺序还是层内顺序”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释外层顺序优先于内层规则顺序，且未分层规则视为在最后。
核心关键词CSS cascade layer priority order - 0020
:nth-child 的表达式 an+b 如何工作？请举例说明 2n、2n+1 和 n+3 分别选中哪些元素。
围绕“:nth-child 的表达式 an+b 如何工作？请举例说明 2n、2n+1 和 n+3 分别选中哪些元素”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释从 1 开始计数，公式中 n 的态度，以及奇偶数常用写法。
核心关键词CSS :nth-child an+b formula - 0021
:only-child 和 :only-of-type 的选择条件是什么？它们与其它结构伪类有何关联？
围绕“:only-child 和 :only-of-type 的选择条件是什么？它们与其它结构伪类有何关联”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明它们判断是否唯一的子元素或类型，但不要求必须与兄弟比较，扩展到与 first-child 的比较。
核心关键词CSS :only-child :only-of-type - 0022
如需兼容旧浏览器，在书写伪类时应采用哪些实践，例如添加前缀或降级方案？
围绕“如需兼容旧浏览器，在书写伪类时应采用哪些实践，例如添加前缀或降级方案”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需举具体伪类如 :focus-within 的 @supports 降级。
核心关键词CSS 伪类 旧浏览器兼容 降级方案 - 0023
:indeterminate 伪类可用于哪些元素？比如复选框尚无选中状态时。
围绕“:indeterminate 伪类可用于哪些元素？比如复选框尚无选中状态时”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明用于 checkbox 通过 JS 设置，也可能用于 radio 组无预选。
核心关键词CSS :indeterminate pseudo-class checkbox - 0024
:focus-within 伪类对哪些场景很有用？它和 :focus 的继承关系如何？
围绕“:focus-within 伪类对哪些场景很有用？它和 :focus 的继承关系如何”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释当子元素获得焦点时父元素匹配，用于表单高亮。
核心关键词CSS :focus-within pseudo-class usability - 0025
:required 与 :optional 伪类是如何对应输入框属性的？请结合实际表单验证场景。
围绕“:required 与 :optional 伪类是如何对应输入框属性的？请结合实际表单验证场景”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释它们根据 required 属性，但不能直接判断有效/无效，可配合 :valid。
核心关键词CSS :required :optional input validation - 0026
:target 伪类是如何根据 URL 片段工作的？请举例说明其在导航中的应用。
围绕“:target 伪类是如何根据 URL 片段工作的？请举例说明其在导航中的应用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明匹配 id 的元素，以及多个目标未定义的情况。
核心关键词CSS :target pseudo-class URL hash - 0027
::before 和 ::after 伪元素生成的内容是否影响元素的几何尺寸？其 content 属性可以设置哪些值？
围绕“::before 和 ::after 伪元素生成的内容是否影响元素的几何尺寸？其 content 属性可以设置哪些值”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明默认是行内级，伪元素也会参与布局，可设 text 和 attr()，但不允许设置嵌套伪元素。
核心关键词CSS ::before ::after content property - 0028
::selection 伪元素可以自定义哪些样式？它对哪些属性有限制？
围绕“::selection 伪元素可以自定义哪些样式？它对哪些属性有限制”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需明确可以设 color、background 等，但限制如 display 无效，并提及有些属性不支持继承。
核心关键词CSS ::selection pseudo-element restrictions - 0029
:in-range 和 :out-of-range 伪类适用于哪些控件？如何设置范围并触发？
围绕“:in-range 和 :out-of-range 伪类适用于哪些控件？如何设置范围并触发”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答需要围绕须提到可适用于 input[type=number] 或 range，需 min/max 属性。
核心关键词CSS :in-range pseudo-class input range - 0030
伪类（如 :hover）和伪元素（如 ::before）在选择器上的区别是什么？在书写时如何注意冒号？
围绕“伪类（如 :hover）和伪元素（如 ::before）在选择器上的区别是什么？在书写时如何注意冒号”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需明确分别、历史单冒号的原因以及主流写法，并举例说明，不深入全部伪类。
核心关键词CSS pseudo-class vs pseudo-element selectors - 0031
使用 revert 重置已继承的属性时，会恢复为父元素的继承值还是用户代理默认值？
围绕“使用 revert 重置已继承的属性时，会恢复为父元素的继承值还是用户代理默认值”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释 revert 在继承属性上会恢复为父元素计算值，若父元素未设则为浏览器默认。
核心关键词CSS revert inherited property reset - 0032
revert 和 revert-layer 关键字在层叠中分别有什么作用？主要区别是什么？
围绕“revert 和 revert-layer 关键字在层叠中分别有什么作用？主要区别是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 revert 回退到用户代理样式，revert-layer 回退到上一层叠层的样式，并给出使用场景，不深入所有级联来源。
核心关键词CSS revert vs revert-layer - 0033
@scope 与 Shadow DOM 的样式隔离有何关系？可以替代吗？
围绕“@scope 与 Shadow DOM 的样式隔离有何关系？可以替代吗”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 @scope 是作用域，但不能替代 shadow DOM 的隔离机制，属于两个维度，不深入 Shadow DOM 部分。
核心关键词CSS @scope vs Shadow DOM - 0034
@scope 规则在 CSS 中的作用是什么？如何定义作用域限制？
围绕“@scope 规则在 CSS 中的作用是什么？如何定义作用域限制”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释 @scope 能让样式限定在 DOM 子树内，影响优先级，但注意浏览器兼容性，不深入 to() 语法细节。
核心关键词CSS @scope rule cascade - 0035
@scope 中的 lower bound（to）有何用途？与 :scope 伪类有何区别？
围绕“@scope 中的 lower bound（to）有何用途？与 :scope 伪类有何区别”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 lower bound 可以终止作用域范围，:scope 指匹配元素本身。
核心关键词CSS @scope lower bound :scope - 0036
对于选择器「ul#nav li.active a:hover」，其优先级各组成部分的数值是多少？
解释如何计算 ul#nav li.active a:hover 的优先级：ID、类、伪类、元素数量，明确伪类算类级别，最终结果为 1-2-3。
核心关键词CSS specificity 优先级计算 示例 - 0037
两个相同优先级的规则发生冲突时，CSS 如何决定最终采用哪一条？
本题给出同优先级规则冲突的判定结论：同层同源时后写的规则胜出；引入层叠层 @layer 后层顺序优先于层内来源顺序，并说明无层样式的默认位置与判断步骤。
核心关键词CSS cascade equal specificity order - 0038
为什么通常说 ID 选择器的优先级高于类选择器？请依据优先级计算规则说明。
本文依据 CSS 优先级计算规则，解释为何 ID 选择器（1-0-0）在数值上始终高于类选择器（0-1-0），并说明少用 ID 的工程原因，兼顾讨论 !important 带来的影响。
核心关键词CSS ID vs class specificity - 0039
在 CSS 中，内联样式和 !important 是如何参与优先级计算的？
围绕“在 CSS 中，内联样式和 !important 是如何参与优先级计算的”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要解释内联样式与 !important 在优先级中的覆盖关系及与选择器优先级的区别。
核心关键词CSS 优先级 内联样式 !important 计算 - 0040
:not() 伪类的优先级是如何计算的？与普通选择器有何不同？
围绕“:not() 伪类的优先级是如何计算的？与普通选择器有何不同”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 :not() 会使优先级为参数中选择器的最高优先级，且列表可多个。
核心关键词CSS :not() specificity calculation - 0041
:enabled 和 :disabled 伪类能适用于哪些元素？如果对链接使用会怎样？
围绕“:enabled 和 :disabled 伪类能适用于哪些元素？如果对链接使用会怎样”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明它们主要针对表单控件，链接不能用。
核心关键词CSS :enabled :disabled form elements - 0042
:first-child 与 :first-of-type 在选择元素上有什么本质区别？
围绕“:first-child 与 :first-of-type 在选择元素上有什么本质区别”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需通过例子说明是兄弟上的第一个还是同一类型的第一个，并提示各自适用的场景。
核心关键词CSS :first-child vs :first-of-type - 0043
在 var() 函数中提供多个备用值是否有效？如果可以，其回退机制是怎样的？
本文解析 var() 的语法限制：仅支持一个 fallback，多值会被当作整体。并说明回退触发条件、无效值处理及工程场景中的误用后果。
核心关键词CSS var() fallback value cascade