移动端学习笔记（黑马教程）-基础概念

一，基本术语

视口：浏览器显示页面内容的屏幕区域，分为布局视口，视觉视口，和理想视口。

二，视口标签

为了在手机上的显示好，我们想要实现的肯定是理想视口。所以有了视口标签：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

三，二倍图

也就是说移动端的时候1px和手机端的分辨率存在一个比例关系，不一定相等。
在iphone里面是1:2的关系

原因如下：

但是如果是图片，就会被放大两倍了！因为每个像素占据一个像素点！


这样就可以避免图片因为在手机端放大，而导致的图片模糊的情况发生。这也是所谓二倍图，多倍图的由来。
那很多时候背景图片也是图片，那它又要怎样设置呢？

切图可以使用ps的切图工具同时切出2倍图，三倍图。

四，移动端开发选择

五，移动端技术解决方案

放心大胆用html5和css3


下载地址：http://necolas.github.io/normalize.css/

六，特殊样式

七，常见移动端页面布局

但是流式布局太大或者太小会出现变形或者布局错乱的问题，所以设置了最小和最大值：