最佳答案:

彩屏设备 和 (最小宽度768px) 和 (最大宽度959px)

仅限 彩屏设备 和 (最小宽度480px) 和 (最大宽度767px)

在你发的代码中其实没有什么不同,用起来效果都是一样的。

下面这样用only才有效果:
@media all and (min-width:xxx) and (max-width:xxx){
/*这段查询的all是针对所有设备(有些设备不一定是屏幕,也许是打字机,盲人阅读器)*/
} @media only screen and (min-width:xxx) and (max-width:xxx){
/*上面针对了所有设备,这段是只(only)针对彩色屏幕设备*/
}

原文:https://zhidao.baidu.com/question/1988207125664534747.html

媒体查询,screen and 和only screen and有什么不同的更多相关文章

  1. 移动WEB开发中媒体查询里的width, device-width, resolution

    /*1.width: viewport的宽度,css像素,三星S3的viewort默认宽度是980px. 当设置viewport width=device-width时,对应的媒体查询中width的值 ...

  2. 移动设备上的媒体查询 CSS media queries for mobile device

    CSS的媒体查询虽然在传统的互联网页面可能发挥的余地不是很大,但是自从苹果和安卓的风靡之后,移动平台上的web开发变得越来越流行了,同时CSS的媒体查询可谓派上了大用场了. 以下为翻译内容,原文来自这 ...

  3. CSS Media媒体查询使用大全,完整媒体查询总结

    前面的话 一说到响应式设计,肯定离不开媒体查询media.一般认为媒体查询是CSS3的新增内容,实际上CSS2已经存在了,CSS3新增了媒体属性和使用场景(IE8-浏览器不支持).本文将详细介绍媒体查 ...

  4. 媒体查询ipad,pc端

    媒体查询 /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ ...

  5. Bulma 中的媒体查询

    在 Bulma 中将设备分为 6 类:手机.平板.触屏设备.桌面.宽屏和大屏.提供了四个阈值. // sass/utilities/variables.sass $tablet: 769px !def ...

  6. 关于媒体查询 @Media Screen 与响应式

    其实CSS2中已经有了媒体查询的概念,但是CSS3中媒体查询功能更加的强大! 首先,我们来看一个小例子 设置媒体查询的 Max Width ,改变窗口大小到600px的时候就会触发一下代码: @med ...

  7. html自适应布局,@media screen,媒体查询

    html自适应布局,@media screen,媒体查询 自适应代码示例: <!doctype html> <html> <head> <meta chars ...

  8. CSS3 @media 查询,根据屏幕screen大小调节前端显示;媒体查询方法的使用

    ------------------- 1.媒体查询方法在 css 里面这样写 -------------------- @media screen and (min-width: 320px) an ...

  9. 媒体查询(pc端,移动端不同布局)

    媒体查询语法: 1.内联写法:and之后必须有空格@media screen and (min-width:960px //判断浏览器大小条件){body{background:red} //常规的样 ...

  10. 深入理解CSS Media媒体查询

    × 目录 [1]媒介类型 [2]媒体属性 [3]语法[4]方法 前面的话 一说到响应式设计,肯定离不开媒体查询media.一般认为媒体查询是CSS3的新增内容,实际上CSS2已经存在了,CSS3新增了 ...

随机推荐

  1. 洛谷P1443 马的遍历(bfs,注意输出格式)

    题目描述 有一个n*m的棋盘(1<n,m<=400),在某个点上有一个马,要求你计算出马到达棋盘上任意一个点最少要走几步 输入输出格式 输入格式: 一行四个数据,棋盘的大小和马的坐标 输出 ...

  2. ZOJ Monthly, January 2019 Little Sub and his Geometry Problem ZOJ4082(模拟 乱搞)

    在一次被自己秀死... 飞机 题目: 给出N,K, Q; 给出一个N*N的矩阵  , 与K个特殊点 , 与Q次查询 , 每次查询给出一个C , 问 在这个N*N矩阵中 , 有多少的点是满足这样的一个关 ...

  3. POJ - 1948 二维01背包

    T了两发,DP方程很简单粗暴 dp[i][j][k]:用前i物品使得容量分别为j和k的背包恰好装满 背包的调用只需一次即可,第一次T就是每次check都丧心病狂地背包一次 对于sum的枚举,其实i j ...

  4. Randy Pausch’s Last Lecture

          he University of Virginia American Studies Program 2002-2003.                     Randy Pausch ...

  5. 1137 Final Grading (25 分)

    For a student taking the online course "Data Structures" on China University MOOC (http:// ...

  6. 豆瓣模拟登录(双层html)

    一.豆瓣模拟登录(双层html) #!/usr/bin/env python # -*- coding: utf-8 -*- #author tom import time from selenium ...

  7. Python归纳 | 爬虫基础知识

    1. urllib模块库 Urllib是python内置的HTTP请求库,urllib标准库一共包含以下子包: urllib.error 由urllib.request引发的异常类 urllib.pa ...

  8. NodeJS 实现阿里云推送。

    虽然阿里云推送也有 NodeJS SDK ,只要在项目中引用 aliyun-sdk 就可以使用了.里面的推送功能了. 我在这里就不写怎么使用aliyun-sdk.给出来的DEMO是回调形式的.用起来有 ...

  9. pat02-线性结构1. Reversing Linked List (25)

    02-线性结构1. Reversing Linked List (25) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, ...

  10. Red–black tree ---reference wiki

    source address:http://en.wikipedia.org/wiki/Red%E2%80%93black_tree A red–black tree is a type of sel ...