10.flex-------03.像素

        1、像素：我们屏幕是由一个一个发光的小点构成的，这些小点就是我们所说的像素

        2、分辨率：1920*1080就是屏幕中小点的数量

        3、在前端开发中，像素分以下情况讨论：css像素和物理像素

                        物理像素：上面所说的小点点就是物理像素（注意：物理像素是屏幕的大小，是不会改变的）

                        css像素：在编写网页时我们所用到的像素就是css像素

        浏览器在显示网页时，一个css像素最终由几个物理像素来显示，由浏览器确定；默认情况下，一个css像素=一个物理像素。

        4、视口：屏幕中用来显示网页的区域称为视口；我们可以通过视口，来观察css像素和物理像素之间的比值。

        默认情况下--------视口宽度  ：1920（css像素）

                                                        1920（物理像素） 

                        此时，css像素和物理像素的比值为1：1

        放大两倍情况下-----视口宽度： 960(css像素）

                                                          1920（物理像素）

                        此时，css像素和物理像素的比值为1：2

     所以我们可以通过改变视口的大小来改变css像素和物理像素的比值

        5、   在不同的屏幕中，单位像素的大小是不同的，单位像素越小越清晰

                        24寸     分辨率：1920*1080

                        i6         分辨率：750*1334

                 注意：智能手机的像素点远小于计算机的像素点

        6、问题：如何将宽度为900px的网页在iphone6中显示？

         默认情况下，移动端的网页会将视口默认设置为980px（css像素），以确保pc端的网页能在移动端显示，如果pc端网页的宽度超过了980px，移动端的浏览器会自动对网页进行缩放，以完整显示网页。所以一般pc端的网页都可以在移动端正常浏览，但不会有很好的体验。为了解决这个问题，大部分网站都专门为移动端设置一个网页。

         上图中，虽然iphone6的像素为750，网页为900，但750为网页的物理像素，我们需要看他的css像素，手机css像素默认为980，所以会有空白。