@media (min-width: 768px){}/*屏幕最小为768px时调用括号里的属性*/@media (max-width: 767px) {}/*屏幕最大为768px时调用括号里的属性*/@media (min-width: 768px) and (max-width: 991px) ...
分类：
Web程序 时间：
2014-10-31 11:25:21
阅读次数：
154
想必接触过响应式布局的朋友对于media query都不会陌生，响应式布局也正是通过这个关键的属性来实现的。一些响应式布局的教程中通常都会进行如下类似设置来实现不同视口宽度条件下的布局示例：@media screen and (max-width:600px){/* 样式一 */}@media .....
分类：
其他好文 时间：
2014-10-30 15:00:59
阅读次数：
152
原文链接：https://github.com/scottjehl/Respond/blob/master/README.md Respond.js 一个快速、轻量的关于 css3 Media Qurery 的媒体特性(min/max-width)的polyfill(什么是polyfill)(用来兼容IE6-8或更多的浏...
分类：
Web程序 时间：
2014-10-22 18:36:53
阅读次数：
608
1 @media (max-width: 767px) 2 3 { 4 body{ 5 margin: 0; 6 padding: 0; 7 } 8 } 9 @media (max-width: 970px)10 {11 body{12 margin: 0;1...
分类：
移动开发 时间：
2014-10-21 12:13:22
阅读次数：
237
其中 max-width 指渲染界面最大宽度，max-device-width 指设备屏幕最大宽度这段代码的意思是 当设备屏幕宽度小于等于480像素并且渲染界面最大宽度小于等于480像素时，引用link.css文件。当设备屏幕宽度大于等于480像素并且小于980像素时，引用link.css文件。当设...
分类：
Web程序 时间：
2014-09-26 19:25:08
阅读次数：
203
1. 文字强制不换行,多余部分用省略号代替white-space:nowrap;text-overflow:ellipsis;overflow:hidden;2. 火狐，禁止拖拽拉动resize:none; 或者 min-width:;max-width:;min-height:;max-heigh...
分类：
Web程序 时间：
2014-09-22 18:59:42
阅读次数：
213
适用于自适应布局小于600像素@media screen and (max-width: 600px) {}大于600像素 @media screen and (min-width: 600px) {}通过css引用多个css,目的容易管理css@import url("common.css");
分类：
其他好文 时间：
2014-09-12 18:36:23
阅读次数：
159
图片在响应式布局中需要做到适应不同宽度的媒介给出最佳显示方案，如水一样会随着宽度的改变而改变。在HTML内的图片，比如文章里插入的图片我们可以通过CSS样式max-width来进行控制图片的最大宽度，如：#content img { max-width:100%; height:au...
分类：
其他好文 时间：
2014-09-04 14:47:39
阅读次数：
199
之前代码：img{ max-width: 100%; border: 0px none;}之后代码：img{ max-width: 100%; border: 0px none; display:block; }
分类：
其他好文 时间：
2014-09-01 13:56:43
阅读次数：
208
CSS 的属性值中经常会出现百分比，搞清它们的基数是一件很重要的事情。我特意查看了一下 W3C 的 CSS2.1 标准，在此整理下：百分比单位乘以包含块的宽度 margin, padding, left, right, text-indent, width, max-width, min-width...
分类：
Web程序 时间：
2014-08-27 10:35:07
阅读次数：
254
