min-width可以容器设置最小宽度,低于改宽度时,会自动加上滚动条,支持ie7及ie7+;

@media only screen and (min-width: /*最小宽度(要加单位px)*/) {
  /*里面设置样式*/
}(只支持ie8+)

两者可以混合在一起用,但是因为@media screen不支持ie9以下,所以使用时应考虑项目对浏览器支持的要求。

min-width 和 @media screen的更多相关文章

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

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

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

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

  3. 利用@media screen实现网页布局的自适应

    利用@media screen实现网页布局的自适应 优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小.只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽 ...

  4. [转载]利用@media screen实现网页布局的自适应,@media screen and

    开始研究响应式web设计,CSS3 Media Queries是入门.Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变内 ...

  5. @media screen解决移动web开发的多分辨率问题

    当今移动设备的发展已经越来越迅速,移动web开发的需求也越来越多多.许多大平台.大门户都纷纷推出了自己的移动web版网站. 随着移动设备飞速的发展,移动产品的屏幕规格越来越多.从几年前的320×240 ...

  6. 利用@media screen实现网页布局的自适应,@media screen and

    开始研究响应式web设计,CSS3 Media Queries是入门.Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变内 ...

  7. css 选择器、元素默认宽度、media screen

    @media screen and (min-width:800px){ .a{  background: url('../image/banner/banner1.jpg') no-repeat l ...

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

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

  9. 使用@media screen解决移动web开发的多分辨率问题

    当今移动设备的发展已经越来越迅速,移动web开发的需求也越来越多多.许多大平台.大门户都纷纷推出了自己的移动web版网站. 随着移动设备飞速的发展,移动产品的屏幕规格越来越多.从几年前的320×240 ...

  10. PrintArea打印,@media screen解决移动web开发的多分辨率问题,@media print设置打印的样式

    PrintArea打印,局部DIV打印插件,依赖JQuery. github:https://github.com/RitsC/PrintArea 当打印时需要临时改变页面布局,可以使用 @media ...

随机推荐

  1. FZU 2186 小明的迷宫 【压状dp】

    Problem Description 小明误入迷宫,塞翁失马焉知非福,原来在迷宫中还藏着一些财宝,小明想获得所有的财宝并离开迷宫.因为小明还是学生,还有家庭作业要做,所以他想尽快获得所有财宝并离开迷 ...

  2. BZOJ2337 [HNOI2011]XOR和路径 【概率dp + 高斯消元】

    题目 题解 突然get到这样路径期望的题目八成是高斯消元 因为路径上的dp往往具有后效性,这就形成了一个方程组 对于本题来说,直接对权值dp很难找到突破口 但是由于异或是位独立的,我们考虑求出每一位的 ...

  3. CodeForces 762D Maximum path

    http://codeforces.com/problemset/problem/762/D 因为是3*n很巧妙的地方是 往左走两步或更多的走法都可以用往回走以一步 并走完一列来替换 那么走的方法就大 ...

  4. 转 Linux命令-文件管理命令

    http://jingyan.baidu.com/article/9113f81bc1c7a72b3214c7d3.html Linux命令-文件管理命令 浏览:4118 | 更新:2012-11-1 ...

  5. 标准C程序设计七---11

    Linux应用             编程深入            语言编程 标准C程序设计七---经典C11程序设计    以下内容为阅读:    <标准C程序设计>(第7版) 作者 ...

  6. Phantomjs和Casperjs,后台网页抓取和交互

    var casper = require('casper').create({ verbose: true, logLevel: 'debug', pageSettings: { loadImages ...

  7. Elasticsearch使用syslog发送Watcher告警事件

    https://blog.csdn.net/mvpboss1004/article/details/70158864?locationNum=9&fps=1

  8. webstorm(二):拼写warning

    逼死强迫症之对拼写进行检查,警告 typo:in word “msgfromfather”

  9. Linux下使用nohup实现在后台运行程序(转)

    相比上一篇http://www.cnblogs.com/EasonJim/p/6833417.html使用screen实现后台运行程序,各有各的好处,多一种选择吧. Linux下一般比如想让某个程序在 ...

  10. Spring启动流程

    首先,对于一个web应用,其部署在web容器中,web容器提供其一个全局的上下文环境,这个上下文就是ServletContext,其为后面的spring IoC容器提供宿主环境: 其次,在web.xm ...