响应式设计 响应式设计的概念（三要素） 流体网格 响应式图片 媒体查询 相关概念 分辨率 是指显示器所能显示的像素的多少 像素密度 dpi/ppi 每平方英寸的像素数 设备像素比 dip/dpr 类似于每像素包含的点数(dppx) 视网膜屏幕 屏幕显示异常清晰（设备像素比大于1） viewport ...
分类：
其他好文 时间：
2017-08-09 23:51:50
阅读次数：
174
html自适应布局，@media screen，媒体查询 自适应代码示例： <!doctype html><html><head><meta charset="utf-8"><title>响应式布局</title><style type="text/css"> *{padding:0px; marg ...
分类：
Web程序 时间：
2017-08-02 19:07:56
阅读次数：
209
在处理移动端自适应布局时，目前前端最流行的方法应该就是使用媒体查询，来设置HTML的字体大小，然后用rem为单位对Dom的宽高进行设置，这个方法的优势在于兼容性方面很好，劣势则在于当前市场上不同的机型太多，尺寸种类比较杂，所以要想做到所以尺寸机型都能适应，工作量相对比较大。目前也有人会选择用百分比进 ...
分类：
移动开发 时间：
2017-07-28 11:01:23
阅读次数：
179
1. 什么是媒体查询 根据设备显示器的特性设置特定的CSS样式。由一个或多个检测媒体特性的条件表达式组成。 使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。 @media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有用的。 当你 ...
分类：
Web程序 时间：
2017-07-21 22:07:32
阅读次数：
453
通过前几天写的两篇博客(浅谈移动端三大viewport和移动端em和rem区别)，我们现在来总结一下如何实现一个最佳方案。 之前在第二篇博客中提到过我们可以使用媒体查询来针对不同设备及做适配，如下图 但是这个可能不会太精准，比如我的设备布局viewport可能是370px，这样只能使用320这一版本 ...
分类：
移动开发 时间：
2017-07-20 19:52:26
阅读次数：
325
“移动网民的规模将在2013年底达到5.0亿，增速为19.1%。预计到2017年，移动网民将赶超PC网民，成为互联网的第一大用户群体，移动端将成为网民最主要的上网渠道。互联网的加速渗透和全民移动互联有望在下一个5年实现。在过去的几年时间里，移动智能设备快速普及，配置迅速提升，许多过去在PC端才能完成 ...
分类：
移动开发 时间：
2017-07-17 11:17:05
阅读次数：
185
1、什么是媒体查询 媒体查询可以让我们根据设备显示器的特性（如视口宽度、屏幕比例、设备方向：横向或纵向）为其设定CSS样式，媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有 width 、 height 和 color （等）。使用媒体查询，可以在不改变页 ...
分类：
Web程序 时间：
2017-07-11 11:16:15
阅读次数：
315
@media (min-width: 993px) and (max-width: 1199px) {} @media (min-width: 700px) and (max-width: 992px) {} @media (min-width: 544px) and (max-width: 699 ...
分类：
其他好文 时间：
2017-07-07 11:38:37
阅读次数：
84
为什么响应式设计需要媒体查询？ 媒体查询 中可用于检测的媒体特性有 width、height 和 color（等）。使用媒体查询， 可以在不改变页面内容的情况下，为特定的一些输出设备定制显示效果。 使用媒体查询步骤： 1、在head中引入下面这个meta标签： width = device-widt ...
分类：
Web程序 时间：
2017-07-04 01:07:43
阅读次数：
289
