HTML(11)——CSS三大特性

CSS拥有三大特性,分别是:继承性,层叠性,优先级

继承性

说明:子级 标签默认继承父级 标签的文字控制属性。

如果子级自己有样式,则父级的属性不生效

例如:

<style>

body{

font-size:30px;

}

</style>

<body>

<div>div</div>

</body>

此时div的内容拥有body设置的属性

层叠性

特点:

  • 相同的属性会覆盖,后面的CSS属性覆盖前面的CSS属性。
  • 不同的属性会叠加,不同的CSS属性都会生效。

例如:

优先级

优先级也叫权重,当一个标签使用了多种选择器,基于不同种类的选择器的匹配规则。

规则:选择器优先级高的样式生效。

通配符选择器<标签选择器<类选择器<id选择器<行内样式<!important

(选中标签范围越大,优先级越低)

叠加计算规则

如果是复合选择器。则需要权重叠加计算。

(行内样式,id选择器个数,类选择器个数,标签选择器个数)

规则:

  • 从左到右依次比较选个数,同一级个数多的优先级高,如果个数相同则向后比较
  • !important权重最高
  • 继承权重最低
相关推荐
于航1 小时前
从 Multi-Agent 到 Skill+CLI:个人助理 1.0 → 2.0 架构演进
前端
2301_786756601 小时前
2026 JCR 秋季数据重载解读:影响因子为什么会变?附期刊影响力数据批量追踪方案
java·服务器·前端
数据掘金1 小时前
小程序埋点方案的埋点灰度发布怎么做?
前端
AiMan1 小时前
读取Meta Muse列表并导出这个功能,是没办法做到的是吗?
前端
老于11111 小时前
AI 生成内容标识落地:显式角标 + EXIF 隐式标识 + 内容编号台账
前端
RaaS1001 小时前
AI网关选型指南:MAI Gateway(魔芋企业级AI网关)vs 开源方案全面对比
前端·后端
小画家~1 小时前
vue3 里面的 itemList.reduce
前端·数据结构·算法
锋行天下2 小时前
langgraph 循环节点的静态和动态实现
前端·后端
keyipatience2 小时前
JS学习笔记(2)数组,函数,作用域,对象
前端·javascript·笔记·学习·html
2603_965148112 小时前
商品价格监控 API 接口:从原理到实战的完整指南
java·前端·数据库·python·生活