<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" type="text/css" href="./mediaTest.css" media="(max-width:640px)" >  注: 在link中加  media="(max-width:640px)"   是对整个mediaTest.css文件起作用
                                            用法。。。
<title>框架起手势</title>
</head>
 
下面是 “./mediaTest.css” 这个文件:
@media only screen and (max-width:639px) {
    body {  background-color: red }
    /* 清楚浮动 */
    .left, .right {clear: both;}
  }

@media only screen and (max-width:640px)中的问题,响应式布局的更多相关文章

  1. css3 @media支持ie8用respond.js 解决IE6~8的响应式布局问题

    respond.js插件实现原理 接下来,需要理解respond.js的实现思路: 第一步,将head中所有外部引入的CSS文件路径取出来存储到一个数组当中: 第二步,遍历数组,并一个个发送AJAX请 ...

  2. media screen 响应式布局(知识点)

    一.什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端--而不是为每个终端做一个特定的版本.这个概念是为解决移动互联网 ...

  3. Css3中的响应式布局的应用

    Media Queries直译过来就是“媒体查询”,在我们平时的Web页面中head部分常看到这样的一段代码: <link href="css/reset.css" rel= ...

  4. css3 响应式布局 Media Query

    1.什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简单说就是一个网站能够兼容多个终端. 2.响应式布局的优缺点? 优点:面对不同分辨率设备灵活性强,快捷 ...

  5. CSS3 响应式布局: @media (min/max-width:***) @font-face

    响应式布局 responsive design @media 属性 bootstrap  css 分析: @media (min-width:768px){ body{***} } use @medi ...

  6. 利用media query写响应式布局

    最近才接触到响应式布局的概念,之前用到的bootstrap就是一种响应式布局的框架.学习的时候参考了http://blog.csdn.net/shoyer/article/details/829301 ...

  7. 使用 media 实现响应式布局

    最近工作有一个需求是将一个界面改为响应式布局,由于UI还没有给设计,于是自己先查了一下资料做了一个demo.其实实现响应式布局的方式有很多,利用media实现就是其中一种,但是他也有一些缺点,比如说要 ...

  8. CSS3学习笔记--media query 响应式布局

    语法:@media screen and (min-width: 320px) and (max-width : 479px) media属性后面跟着的是一个 screen 的媒体类型(上面说过的十种 ...

  9. css3 @media 实现响应式布局

    使用css3的@media,可以实现针对不同媒体.不同分辨率的响应式布局. 方法1:根据不同分辨率使用不同css文件 <link rel="stylesheet" media ...

  10. 六、使用media实现响应式布局

    常见写法: 下面总结常见的响应式布局的分类: @media screen and (max-width:320px){ #talkFooter .editArea{…… } } @media scre ...

随机推荐

  1. iOS项目之解析HTML数据

    最近因为需求,一直在做HTML数据的解析,从网页中去获取需要的数据,然后展示到自己的app中. 在网上找了很多资料,大多都是TFHpple这个第三方框架,能够根据标签节点获取对应的数据,但是现在我需要 ...

  2. EditPlus配置GCC

    --GCC Compile-- 命令:D:\GCC\MinGW_RP_Green\bin\gcc.exe 参数:$(FileName) -o $(FileNameNoExt).exe 初始目录:$(F ...

  3. AngularJS的简单入门

    AngularJS诞生于2009年,由Misko Hevery等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核心 ...

  4. deepin安装Python3.6和pip

    1.安装python3.6 sudo apt-get install python3.6 2.修改软连接 sudo ln -s /usr/local/bin/python3.6 /usr/bin/py ...

  5. v-on事件绑定指令

    v-on:事件绑定 v-on简写:@ 绑定click事件时: 代码: <script> window.onload= () =>{ let vm=new Vue({ el:'#two ...

  6. gdb调试程序函数名为问号,什么原因?step by step解决方案

    gdb调试程序函数名为问号,什么原因? http://bbs.chinaunix.net/thread-1823649-1-1.html http://www.bubuko.com/infodetai ...

  7. Deep Learning Terminologies

    Deep Learning Terminologies batch full batch 已知在梯度下降中,需要对所有样本进行处理过后然后走一步(梯度更新),那么如果我们的样本规模的特别大的话效率就会 ...

  8. centos6.5安装部署zabbix监控服务端和客户端

    部署zabbix服务端需要LNMP环境(nginx,mysql,php),其它数据库也可以,我这里使用mysql,关于LNMP环境部署,可以参考我的另一遍文章:http://www.cnblogs.c ...

  9. (4opencv)对OpenCV中“旋转”的思考和实验

    ​    我记得曾经有人对OpenCV的旋转吐槽,意思是它自己没有很好的关于选择的算法.在新的版本里面添加了这些函数(我还没有时间去看是什么时候pr的).现在一个比较棘手的问题,就是OpenCV中旋转 ...

  10. 前端 --- 6 jQuery 初始

    一.引入方式 1.直接下载文件到本地(最常用),从本地中导入 2.使用文件的网络地址,就像我们img标签里面的那个src的用法差不多. 引入完之后,就可以直接使用jQuery的语法来写了,但是还是要写 ...