最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
同一元素应用多个class的优先级的测试!
时间:2022-07-02 12:45:07 编辑:袖梨 来源:一聚教程网
使用多个class,以空格分开,如:
效果:
代码如下 | 复制代码 |
.a1 { font-size: 9pt; color: #FF0000; } .a2 { font-size: 18pt; color: #0000FF; } .a1 { font-size: 9pt; color: #FF0000; } .a2 { font-size: 18pt; color: #0000FF; } a1 a2 a2 a1 a1 a2 |
[ 可先修改部分代码 再运行查看效果 ]
调换一下a1和a2的顺序 Source Code to Run []
代码如下 | 复制代码 |
.a2 { font-size: 18pt; color: #0000FF; } .a1 { font-size: 9pt; color: #FF0000; } .a2 { font-size: 18pt; color: #0000FF; } .a1 { font-size: 9pt; color: #FF0000; } a1 a2 a2 a1 a1 a2 |
[ 可先修改部分代码 再运行查看效果 ]
加上!important看看效果 Source Code to Run []
代码如下 | 复制代码 |
.a2 { font-size: 18pt; color: #0000FF!important; } .a1 { font-size: 9pt; color: #FF0000; } .a2 { font-size: 18pt; color: #0000FF!important; } .a1 { font-size: 9pt; color: #FF0000; } a1 a2 a2 a1 a1 a2 |
[ 可先修改部分代码 再运行查看效果 ]
结论:若同时应用多个class,后定义的优先(即近者优先),加上!important最优先!
相关文章
- 必须拿住:迈克尔·赛勒发布比特币牛市图表 07-08
- 大侠立志传爱猫失踪任务完成指南 07-08
- DOTA2电竞世界杯2025赛程一览 07-08
- YellowPencil Pro v7.6.7 WordPress 可视化 CSS 编辑插件 07-08
- 魔兽世界强力巨魔之血药水怎么获得-强力巨魔之血药水获取方法 07-08
- 关于朋友圈说说的好句子正能量 正能量的朋友圈说说 07-08