(持续更新中......)
设置meta 标签
<!-- HTML <head></head> 中加入 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
注:
width 和height 指令分别指定视区的逻辑宽度和高度,单位是以像素为单位的数字或特殊标记符号(如device-width);
initial-scale 指页面初始缩放比例,默认值因智能手机浏览器的不同而有所差异,通常情况下设备会在浏览器中呈现出整个Web 页面,设为1.0则将显示未经缩放的Web 文档;
user-scalable 指令指定用户是否可以缩放视区(yes/no);
maximum-scale 和minimum-scale 指令用于设置用户对Web页面缩放比例的限制。范围为0.25 ~ 10.0;
使用媒体查询(Media Query) 对指定视图宽度范围的页面进行渲染
例如:
@media screen and (max-width: 980px) {
/* styles */
}
/** iPad **/
@media only screen and (min-width: 768px) and (max-width: 1024px) {}
/** iPhone **/
@media only screen and (min-width: 320px) and (max-width: 767px) {}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。