响应式设计(布局)： 出发点挺好，实际用起来非常不方便 1.大多数手机width=320px 2.大多数pad的width=1024px 媒体查询缺点： 1.流量非常浪费 2.少部分手机的分辨率不统一——非常乱 3.除了媒体查询，有更简单的方法——没必要media 媒体查询 @media scree ...
分类：
其他好文 时间：
2016-06-14 11:35:43
阅读次数：
131
1、什么是媒体查询 媒体查询可以让我们根据设备显示器的特性（如视口宽度、屏幕比例、设备方向：横向或纵向）为其设定CSS样式，媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有 width 、 height 和 color （等）。使用媒体查询，可以在不改变页 ...
分类：
Web程序 时间：
2016-06-06 16:22:16
阅读次数：
180
head里面的代码 媒体查询适应不同屏幕代码 ...
分类：
其他好文 时间：
2016-06-02 11:08:39
阅读次数：
133
了解css的人知道，对于不同的屏幕尺寸，css使用一种名为媒体查询的东东来适用不同的屏幕尺寸，以提升用户体验。当用户使用PC等大屏幕的设备时，网页将呈现一种布局形式；而当用户使用手机等小屏幕设备时，布局将发生变化，比如将原来的两列布局变为一列。 就是这个！ 参考链接：http://zh.learnl ...
分类：
其他好文 时间：
2016-05-31 20:40:27
阅读次数：
497
/*媒体查询-字体设置*/
/*平滑过渡*/
html{-webkit-transition:font-size.2sease-out;transition:font-size.2sease-out;}
/*设计稿宽度=640时,4rem=400px,1rem=100px,.5rem=50px,.1rem=10px以此类推*/
@mediascreenand(max-width:1280px){
html{font-size:200px;}
}
@mediascr..
分类：
移动开发 时间：
2016-05-27 18:45:47
阅读次数：
638
媒体查询： 1、媒体查询优点：基于设备的属性检测设备，这样一来就不需要使用浏览器探测脚本，之后允许直接安装设备的功能去设定目标样式表，也就是说检测用户使用小屏幕的设备，css规则就会调整以适应该屏幕的尺寸，从屏幕上去除无关元素，提供更小的图片，让文本变得更加清晰 2、语法 @link元素调用,多种媒 ...
分类：
Web程序 时间：
2016-05-24 20:31:15
阅读次数：
407
总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法。 http://www.360doc.com/content/14/0704/06/10734150_391862769.shtml 准备工作1：设置Meta标签 首先我们在使用Media的时候需要先设置下面这段代码，来兼容移动设备的 ...
分类：
Web程序 时间：
2016-05-24 19:09:02
阅读次数：
2150
一、Css3的Media Queries 翻译成中文是“媒体查询”，有如下几种引入方式： 1、直接head中引用，其实media在css2中已经存在，不过，他的主要作用您没有关注，兼容所有媒体等。你肯定见到过如下的写法： 现在，我们为了兼容屏幕的大小，可以这么写： 在屏幕最大是600px的时候加载“ ...
分类：
移动开发 时间：
2016-05-24 15:02:55
阅读次数：
262
4-1实现原理 网格系统的实现原理非常简单，仅仅是通过定义容器大小，平分12份(也有平分成24份或32份，但12份是最常见的)，再调整内外边距，最后结合媒体查询，就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。 显示效果如下图所示: 4-2工作原理 Boot ...
分类：
其他好文 时间：
2016-05-21 12:55:19
阅读次数：
259
Media所有参数汇总 我们最常需要用到的媒体查询器的三个特性，大于，等于，小于的写法。媒体查询器的全部功能肯定不止这三个功能，下面是我总结的它的一些参数用法解释： width:浏览器可视宽度。 height:浏览器可视高度。 device-width:设备屏幕的宽度。 device-height: ...
分类：
其他好文 时间：
2016-05-19 15:05:23
阅读次数：
106
