关于CSS样式的优先级问题
GhostZhang
发布于 2022-08-22 00:44:29
发布于 2022-08-22 00:44:29
代码可运行
运行总次数：0
代码可运行
关于CSS样式的优先级问题
由 Ghostzhang 发表于 2005-10-19 18:36
在CSS中，你可以为同一个标签定义多个样式，如下面的例子：
#aaa{
background-color: Fuchsia;
}
.ab{
background-color: Black;
}
td{
background-color: Aqua ;
}<table>
<tr>
<td class="ab" id="aaa" style="height:200px;width:200px;background-color: Blue;"></td>
</tr>
</table>这么多的样式，哪个是有效的呢？ 我们一个一个把上面的样式删除，在浏览器中可以看到： style的优先级最高，然后是id，再来是class，最后才是td 另外，使用!important可以改变优先级别为最先，如下：
#aaa{
background-color: Fuchsia;
}
.ab{
background-color: Black;
}
td{
background-color: Aqua !important;
}<table>
<tr>
<td class="ab" id="aaa" style="height:200px;width:200px;background-color: Blue;"></td>
</tr>
</table>td将会显示为Aqua 即优先级变为td，然后是style，再来是id，最后是class
注：谢谢朋友指出了文章中的一个错误，现已经改正。
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2005-10-19 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
暂无评论
推荐阅读
![[原创]CI持续集成系统环境--Gitlab+Gerrit+Jenkins完整对接](https://ask.qcloudimg.com/http-save/yehe-1207996/z80thk10pk.png)
推荐阅读
相关推荐
gerrit3.0安装
更多 >
腾讯云开发者
