一. @media 格式

@media all and (min-width:xxx) and (max-width:xxx) (亦可以写成@media all and (min-width:xxx) and (max-width:xxx)) {
/*这段查询的all是针对所有设备(有些设备不一定是屏幕,也许是打字机,盲人阅读器)*/
}

@media only screen and (min-width:xxx) and (max-width:xxx){
/*上面针对了所有设备,这段是只(only)针对彩色屏幕设备*/
}

@media only screen and (min-width:1024px) and (max-width:1292px){
body div{
font-size:30px;
color:red;
}
}

bootStrap @media 用法的更多相关文章

  1. 1:CSS中一些@规则的用法小结 2: @media用法详解

    第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下     at-rule ...

  2. 转: CSS3 @media 用法总结

    一.首先是<meta>标签 <meta name="viewport" content="width=device-width, initial-sca ...

  3. bootstrap基本用法

    进入中文官网:http://www.bootcss.com   开始第一个Demo   准备工作: (1)进入bootstrap中文官网,点击起步 (2)下载生产环境         下载好的文件是一 ...

  4. CSS中@support的用法 及其calc、media用法

    背景: 一次偶然的机会遇到一个朋友在刷css的库其中有这样一道题(css变量如何定义,calc, support, media),我看一眼熟悉而陌生,知其一而不知其二,叔可忍婶不可忍,马上就度娘起来, ...

  5. 样式link属性media用法--媒体类型查询

    引用外部样式使用link 你可能想针对将要显示页面的设备类型(桌面PC.笔记本电脑.平板电脑.手机或者甚至页面的印刷版本)来调整页面的样式,可以利用一个media属性, 在<link>元素 ...

  6. @media用法。

    @media版本:CSS2  兼容性:IE5+   语法:    @media  sMedia { sRules }    说明:    sMedia :  指定设备名称.请参阅附录:设备类型  sR ...

  7. Bootstrap 基本用法(续)

    在bootstrap中有很多的组件,这些组件可以帮组我们更快的写出一些好看的样式,下面就是一些样式: 导航框: <ul class="nav nav-tabs"> &l ...

  8. Bootstrap 基本用法

    使用bootstrap框架的步骤: 1.引用bootstrap的css框架,这样可以通过bootstrap来布局: <link rel="stylesheet" href=& ...

  9. 【Bootstrap简单用法】

    一.下载及使用 参考网站:http://www.bootcss.com/ 1.使用 BootCDN 提供的免费 CDN 加速服务(同时支持 http 和 https 协议) <!-- 最新版本的 ...

随机推荐

  1. tmux使用——2019年11月20日16:40:15

    1.tmux 命令行的典型使用方式是,打开一个终端窗口(terminal window,以下简称"窗口"),在里面输入命令.用户与计算机的这种临时的交互,称为一次"会话& ...

  2. wraps的补充

    # import time# def index(name):# '''index函数'''# time.sleep(1)# print('Welcome %s to China'%name)# re ...

  3. checked属性 详解

    注意:当元素中有checked属性时,其值无论是什么,都是被选中状态,那怎么才能让其不被选中呢,就是用jquery或js代码实现 1.html中的checked属性.仔细研究下会发现一个很怪异的现象. ...

  4. C#基础提升系列——C#任务同步

    C#任务同步 如果需要共享数据,就必须使用同步技术,确保一次只有一个线程访问和改变共享状态.如果不注意同步,就会出现争用条件和死锁. 不同步导致的线程问题 如果两个或多个线程访问相同的对象,并且对共享 ...

  5. note4

  6. u-tools图床便捷生成markdown图片

    u-tools 图床 上传图片生成markdown图片非常便捷. 支持的图片服务器有几种,其中搜狗.网易和掘金的加载速度更快些: 也可以用阿里与和腾讯云的OSS; 其中网易生成图片不是原图尺寸好像被改 ...

  7. Delphi 安装Cnpack cnvcl后界面不断弹出 Memory Manager's list capablity overflow ,please enlarge it!

    Delphi 安装Cnpack cnvcl后界面不断弹出 Memory Manager's list capablity overflow ,please enlarge it! 解决方法:删除指定  ...

  8. Codeforces 803F - Coprime Subsequences(数论)

    原题链接:http://codeforces.com/contest/803/problem/F 题意:若gcd(a1, a2, a3,...,an)=1则认为这n个数是互质的.求集合a中,元素互质的 ...

  9. QTP笔记--检查点、ChildObjects方法

    一.自带检查点函数 '最后一个参数为timeout,单位是毫秒 Browser( "SAP NetWeaver Portal" ).Page( "SAP NetWeave ...

  10. spring cloud gateway 拦截request Body

    在接入Spring-Cloud-Gateway时,可能有需求进行缓存Json-Body数据或者Form-Urlencoded数据的情况. 由于Spring-Cloud-Gateway是以WebFlux ...