用JS改变页面中b标签的样式啊样式的等

最新推荐文章于 2022-08-06 20:18:48 发布

weixin_30827565

最新推荐文章于 2022-08-06 20:18:48 发布

阅读量333

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/agansj/p/7787652.html

版权

用JS改变页面中b标签的样式啊样式的等，实际上是在标签内加上样式，用媒体查询的话，不能生效

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
        @media screen and (max-width: 1000px) {
    div {
        color:lightblue;
    }
}
@media screen and (max-width: 800px) {
    div {
        color:pink;
    }
}
@media screen and (max-width: 600px) {
    div {
        color:purple;
    }
}


	</style>
</head>
<body>
	<div class="dv">每天你和阳光都在</div>
	<button>点我</button>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
	 $('button').on('click',function(){
	 	 $('.dv').css('color',"red");
	 })
</script>
</html>

　　至于为什么？原因在于，当用JS执行的时候，是在标签内加的样式，权限很大，而用媒体查询的时候，还是CSS的标签的权限，就是div的权限，很显然，权限不够，覆盖掉标签内的权限，所以当JS执行的时候，即使上面有媒体查询的样式还是不能生效的。

把上面的代码运行一下，F12就可以知道原因了。

转载于:https://www.cnblogs.com/agansj/p/7787652.html

weixin_30827565

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
用JS改变页面中b标签的样式啊样式的等

用JS改变页面中b标签的样式啊样式的等，实际上是在标签内加上样式，用媒体查询的话，不能生效<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style&...
复制链接

扫一扫