HTML怎么判断选择器的优先级及权重

发布时间:2022-03-23 10:35:54 作者:iii
来源:亿速云 阅读:266

这篇文章主要讲解了“HTML怎么判断选择器的优先级及权重”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“HTML怎么判断选择器的优先级及权重”吧!

先来比较一下行内样式表及id选择器

代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>CSS选择器</title>

<style type="text/css">

#myColor{

color: blue;

}

</style>

</head>

<body>

<h4 style="color:red;" id="myColor">我是内容部分</h4>

</body>

</html>

行内的样式比id选择器的优先级要高,接下来我们再来比较一下id选择器及类别选器的样式。

代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>CSS选择器</title>

<style type="text/css">

.myStyle{

color: orange;

}

#myColor{

color: blue;

}

</style>

</head>

<body>

<h4 id="myColor" class="myStyle">我是内容部分</h4>

</body>

</html>

实际操作得出结论,优先级别:行内的样式>id选择器>类别选择器。

感谢各位的阅读,以上就是“HTML怎么判断选择器的优先级及权重”的内容了,经过本文的学习后,相信大家对HTML怎么判断选择器的优先级及权重这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是亿速云,小编将为大家推送更多相关知识点的文章,欢迎关注!

推荐阅读:
  1. 6-选择器优先级别
  2. css样式权重优先级

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

html

上一篇:CSS层级选择器怎么用

下一篇:浏览器端如何使用Less

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》