用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 ...
随机推荐
- js编程精解--笔记
看这本书的目的是为了更好的使用mongodb,所以只看js编程语言基础,不看浏览器和画布. 需要看1-11章,共160页 第一章 值.类型和运算符 第二章 程序结构 第三章 函数 第四章 数据结构:对 ...
- NBUT 1222 English Game（trie树+DP）
[1222] English Game 时间限制: 1000 ms 内存限制: 131072 K 问题描写叙述 This English game is a simple English words ...
- 20170218 OO-ALV标准工具栏按钮
原文地址:OO ALV 工具栏对于的功能码 图标与对应的 功能码 明细 &DETAIL 检查 &CHECK 刷新 &REFRESH 剪切 &LOCAL&CU ...
- 恢复MySQL数据库删除的数据
在日常运维工作中,对于数据库的备份是至关重要的!数据库对于网站的重要性使得我们对 MySQL 数据库的管理不容有失!然而是人总难免会犯错误,说不定哪天大脑短路了,误操作把数据库给删除了,怎么办? 下面 ...
- Codility经典算法题之九：MissingInteger
Task description: This is a demo task. Write a function: that, given an array A of N integers, retur ...
- CentOS 7.2安装Jenkins自动构建Git项目
1.环境 本文使用VMWare虚拟机进行实验. 最终实现目标,在Jenkins服务器上新建构建任务,从Git服务器上拉取master HEAD(不编译,仅演示),部署到"目标服务器" ...
- 对象数组、集合、链表(java基础知识十五)
1.对象数组的概述和使用 * 需求:我有5个学生,请把这个5个学生的信息存储到数组中,并遍历数组,获取得到每一个学生信息. Student[] arr = new Student[5]; //存储学生 ...
- Oracle基础：表空间名称大小写问题
现场环境: 操作系统:windows Oracle版本:10g 今天在通过imp导入数据时,日志提示TS_W5_D表空间不存在.感觉很奇怪,导入用户的表空间是ts_w5_d,并 ...
- [SoapUI] Jenkins 配置不同环境(TP, LIVE)
- [Selenium] 使用Chrome Driver 的示例
//导入Selenium 库和 ChromeDriver 库 pachage com.learningselenium.simplewebdriver; import java.util.concur ...