用JS改变页面中b标签的样式啊 样式的等
用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就可以知道原因了。
用JS改变页面中b标签的样式啊 样式的等的更多相关文章
- js统计页面中各个标签出现的次数,倒序排列
// html <html> <div>hello</div> <div>world</div> <a href="&quo ...
- js 和 css 中 不能使用 jsp 页面中一些 标签 和 java 代码等,应注意
js 和 css 中 不能使用 jsp 页面中一些 标签 和 java 代码等,应注意 如 ${ } <%%> 等
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- 禁止手机页面中A标签长按弹出路径框
//禁止手机页面中A标签长按弹出路径框 window.onload=function(){ document.documentElement.style.webkitTouchCa ...
- 在php中,如何将一个页面中的标签,替换为用户想输出的内容
前言:釜山行,暴露人性, ———————————————————————————————————————————————————————————————————————————— 今天说一个最简单的例 ...
- js去除字符串中的标签
var str="<p>js去除字符串中的标签</p>"; var result=str.replace(/<.*?>/ig,"&qu ...
- 找到你的位置(JS在页面中的位置)最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分
找到你的位置(JS在页面中的位置) 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分. 放在<head>部分 最常用的方式是在页 ...
- Jquery和JS获取ul中li标签(转)
js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...
- Jquery和JS获取ul中li标签
js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...
随机推荐
- 基于bootstrap_登陆页面
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 李洪强iOS开发之-修改状态栏的字体的颜色
李洪强iOS开发之-修改状态栏的字体的颜色 修改的效果: -(void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated]; [ ...
- 键盘HOOK显示按键信息
GetKeyNameText(MapVirtualKey(iKeyValue,0)<<16));//iKeyValue 的值为 VK_ESCAPE 等 LRESULT CALLBACK L ...
- 如何使用Visual Studio构建libiconv
参考博文:How to Build libiconv with Microsoft Visual Studio - CodeProject libiconv源码下载地址:libiconv - GNU ...
- JAVA 0 的突破
使用IntelliJ Idea 开发的一个Java 处理数据文件折行的问题,整体来说功能比较简单的一个java脚本的开发,跨平台的优势可以处理windows和lunix平台的文件折行 package ...
- 关于 SWT 的UI线程和非UI线程
要理解UI线程,先要了解一下“消息循环”这个概念.链接是百度百科上的条目,简单地说,操作系统把用户界面上的每个操作都转化成为对应的消息,加入消息队列.然后把消息转发给对应的应用程序(一般来说,就是活动 ...
- Ruby中任务构建工具rake的入门学习教程
参考:http://www.jb51.net/article/81476.htm Rake简介 Rake的意思是Ruby Make,一个用ruby开发的代码构建工具. 但是,为什么Ruby需要Rake ...
- (linux)mmccard驱动的读写过程解析
mmc io的读写从mmc_queue_thread()的获取queue里面的request开始. 先列出调用栈,看下大概的调用顺序, 下面的内容主要阐述这些函数如何工作. host->op ...
- spring boot---WebFilter注解 实现自定义登录过滤器
https://my.oschina.net/wangnian/blog/647976 http://www.jianshu.com/p/05c8be17c80a
- 哈希表---线性探测再散列(hash)
//哈希表---线性探测再散列 #include <iostream> #include <string> #include <stdio.h> #include ...