同级css渲染顺序问题

最新推荐文章于 2022-08-15 14:06:43 发布

weixin_30781775

最新推荐文章于 2022-08-15 14:06:43 发布

阅读量328

点赞数

原文链接：http://www.cnblogs.com/dannyliu/p/5435512.html

版权

CSS基本渲染顺序大家估计都很清楚

内嵌>样式表
ID >> Class >> 标签
组合的权重是选择器越多，权重越大

问题：同级（即权重完全一样）的css怎么渲染？

实验

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test html css</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <div class="a b"></div>
</body>
</html>

css

.b{
    background-color: black;
}
.a{
    background-color: red;
}

实验结果

结论

这个实验中特意在div的class中写的顺序是先a后b，在css文件中写的是先b后a，从结果可以看到时css文件中的书写顺序决定了最终渲染结果

转载于:https://www.cnblogs.com/dannyliu/p/5435512.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30781775

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
同级css渲染顺序问题

CSS基本渲染顺序大家估计都很清楚内嵌>样式表ID >> Class >> 标签组合的权重是选择器越多，权重越大问题：同级（即权重完全一样）的css怎么渲染？实验html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&gt...
复制链接

扫一扫