空间混色法：
美学三原色：红黄青
工业三原色：
印刷三原色：品红……
光学三原色：rgb( 颜色1， 颜色2， 颜色3 )三色混成一个颜色，作为计算机显像管的一个基本成色原理，运用的是空间z轴叠加法；这个在光的混合上是没有任何问题的，因为光是没有实质的。但是把它放在一个器皿里面，来这么排列是不科学的。呈现光的设备是一个固体，你把粉状体、不管是荧光粉还是滤光片，这时候用z轴来叠加处理是不科学的。
三原色构成一个像素点，一个像素包含三个像点 || 色点，来靠这个像点来调节这个颜色，来混合所有的颜色；三个像点在空间物理设备上的排列方式，就是接近于并排排列的，不是叠加在一起的。那么这三个像点是怎么来排布的呢？就是运用了空间混色法；
在任何的可视屏幕上，能够成像的这种物理学材料，基本上都是平铺的，没有空间叠加的。比如说三原色，他们在空间上并排排列的方法就叫做空间混色法；
这么并排排列怎么实现光学的调色呢？利用了视觉差，我们的眼睛识别不了那么细致的颜色，比如说我们这个三个颜色调到无限小，都是饱和的，然后就成了一个点。
像素的基本构成：像素作为屏幕上的一个成色的最基本单位，像素最小单位是像点，像素有三个像点来构成，无数个像素点加起来之后就形成了绚丽的颜色；
显示屏：
crt显示屏（大脑电视，大脑电脑）：虽然已经过时了，但是它给出的一些像点的排列，包括像点点距，crt屏求点距的方法是几乎所有屏幕都通用的。
crt屏的最末端一个电子枪，电子枪可以打出电子束(光学的电子束)，电子束会打到这个屏幕上，屏幕上涂了很多荧光粉，荧光粉在接到这种高频持续电子束的之后，会被点亮，你打过去一束它就亮一下，你持续打它就持续亮，这是荧光粉发光的一个原理。荧光粉有很多种荧光粉，有红、篮、绿荧光粉，这个荧光粉排列的方式就是亮点的排列方式，成三角形 || 品字形 || 栅格形；根据电子束强弱的不同，荧光粉的颜色强弱不同最后混合出不同的颜色，形成一个像素点，多个像素点就成像了；
其实电子枪在打到荧光粉的时候，它不可能就是放任无数的电子枪一起来打这个荧光粉，荧光粉有多少个点，电子枪就打多少个电子束，好一点的电子枪一枪能射出三束，不好的电子枪一枪能打出一个束，那想打出一个像素点，需要三个电子枪要同时打，并且同时瞄准，肯定是有误差的。所以就是说便宜的是三枪的，贵的就是一枪打三束（索爱是最早实现的）；电子束它容易歪，也就容易散射（光有散射效应），所以中间有一个板（遮罩层；与荧光粉相对应），用来矫正。
lcd液晶屏、led特殊液晶屏：
后来到1888年的时候，德国的生理学家，发现了一种材料叫做液晶材料，液晶材料能顾呈现两种态，固态和液态，通过高温 || 磁场……能够变幻，既能固态也能液态；液晶电视就是根据这种材料做出来；
液晶电视成像原理：由于液晶材料呈现液态和固态而且非常细腻的受控制，所以通过一些调控方式可以让一个局部的一个液晶材料变成固态和液态，来对光发生不同的偏折，最后帮我们打出红绿蓝这样的一个成像。液晶屏很薄，液晶材质放在了两个导电的玻璃里面，导电玻璃充上电，加上磁场，磁场会作用到液晶的每一个颗粒上，磁场的方向和强弱，就会导致液晶屏当前的这个点成固态还是液态，还有对于光偏折；当磁场让液晶屏变成了一种液态，这个光就能过来，变成固态的时候这个光就不能过来，就会向上发生一个偏折相当于就没有了。光只要打过来了，屏幕前面依然有一个成像的区域，里面放的是滤光片，滤光片也有红绿蓝，也是根据像点的排列，凡是排列的，能射过来的光就会点亮滤光片，通过空间混色法形成我们想要的像素色。
像素究竟多大？
国际上的规范没有说像素大小的。我们都指的是点距，
点距就是从一个同色的点到另一个同色的点的距离。用点距来表示这里面有多少个像素。比如说同一个尺寸下，像素多，或者同一个尺寸下点距小一个概念。
像素说到底还是一个相对单位。即使是物理像素（物理设备出厂时像素的大小，不同设备的物理像素大小值是不一样的）也是相对单位；一般情况下，我们的像素大小普遍衡量标准单位是dpi；
DPI：一英寸所能容纳的像素点数，像素点数越多像素越小成像效果就越好；
1英寸in = 2.54 cm；如果能达到96dpi就不错了（约等于2.54 /100 = 0.25mm），一般电脑的dpi 最大也就200dpi ≈ 0.1mm || 0.15mm,这种设备就老精细了，这就算高的了。兄弟的表现形式是ppi；dpi是用来表示打印机设备的，也就是打印机在一英寸的屏幕里能打印多少个墨点，ppi是用来表示一英寸多能容纳的像素点数（点距数）；所以dpi和ppi可以通用。
物理像素指的是出厂时的像素大小，一般多个不同物理设备出厂时的dpi是不同的。那么同样的css代码放到不通设备上去显示，，利用浏览器调用操作系统的成像驱动来显示，显示的效果也不一样的，所以出来了一个参照像素。
参照像素：为了让不同机器上显示的图像能有一样的体验效果，提出来了参照像素概念。
比如说设置一个标杆，大家都向这个标杆靠拢，这个标杆是以96dpi的这样的一个电脑的一臂之长的视角去看，显示出的具体大小（经历了一系列的视角、视度……，然后乘完之后，约等于1/96 in(英寸) 的这个像素点）。假设我的这个屏幕是96dpi，物理像素就是设备像素，参照像素就是比例转换之后的像素，这时的比例为 1 ：1。
如果你的设备是200dpi，我想展示出和设备96dpi时一样的大小图像，就需要把垂直像素点和水平像素点当做一个像素点来使用，才能完成一样的效果。所以参照96dpi的这个标杆比例比完之后，200dpi设置像素的时候需要 2：1。参照像素就是大家都会朝着这个像素显示的大小去转变。
比如说这个参照像素是 100p100px的比例尺进行转换，那我这100px100px放在这个参照像素屏幕里面展示出什么样子，那些机型也就展示出什么样子。如果把100dpi 100dpi放在200dpi中，就变成1/2变小了，那我想让它呈现一样的大小，这时候就有一个转换比例，从参照像素—>实际像素的比例，然后就是(100px2) (100px*2)；设备会依照这个参考像素来转换自己所用的像素格，参照像素自己的比例、尺寸必须保持一样的，具体内容填充点，就是像素点越多，填充的越好看。
参照像素也叫作css像素，css像素就是我们面向编程的像素，css像素也叫作逻辑像素。
我们依照参考像素的大小编了100px100px的盒子，操作系统就会判断自己的设备，假设是200dpi的设备，你用真实的100px’物理像素来展示200dpi，盒子就肯定特别小。所以我们就需要依照参考像素进行转换，css像素就是实现这种功能的，机器看完css像素之后，都会依照自己的dpi 自身转换，所以（100px2）：（100px*2）；
设备像素比，dpr：作为设备从自己的物理像素比放大到css逻辑像素非常关键的一个参数。
dpr = 物理像素 / css像素（96dpi）；
css像素是一个逻辑像素，dpr 的结果是要看 dpi。你同样的一个空间类，你容纳的物理像素是不多的。假设你的设备是200dpi，dpr≈2，证明你的设备还挺先进的，比参照的像素水平和垂直方向还多出来2倍像素点，面积就多出来4倍，到时候成像的时候就是用两个的像素点组成一个像素点，或者说面积上4个像素点组成一个像素点来展示这样的一个尺寸；实际上，我们写逻辑像素时，你依照200dpi像素的这样一个设备以它的物理像素作为基本单位的图像的时候，每个设备根据物理像素dpi的不同，dpr也就不同。比如dpr=3 || dpr=1。
我们有两个非常经典的机器，第一个机器iPhone 3，第二个机器是iPhone 4，它俩尺寸是一模一样的。iphone4 同比例的像素的dpi是iphone3的2倍。iphone3是180dpi，iphone是360dpi，它俩在成像上就有一个dpr的一个比值了；iPhone 3的比值是多少？参照像素是一个模糊值，但你不能把像素劈成一半，都是取整的。你最多让iphone3 dpr=1，iphone4 dpr=2；也就是说你写一个css逻辑像素，在实际场上需要用多少个物理像素去帮你实现。比如在iphone3的这个设备上添加一个100px100px的方块，那在iphone4的上用了逻辑像素，那就是在逻辑上的显示大小都是一样的，但是实际上iphone4用的逻辑像素肯定比iphone3多了不止一倍，垂直方向、水平方向都多了一倍，面积上多了4倍。如果填充了纯色的话，它俩区别无非就是用的像素点的数量。如果里面有成像的话，里面依照iphone4的标准传了一张200px200px图片，添加尺寸里面逻辑像素是100px100px，因为dpr是2，但是我放进去的是200px200px的图片机器会帮我们还原，逻辑屏会转成实际屏变成200px。所以iphone4能够完美展示出来。iphone3就会丢失像素点，就不太好；
逻辑像素就是保持尺寸，实际上填充内容肯定还是以像素点多，你填的内容就更丰富。 你拿高像素点显示低像素点是可以实现的，比如一个点是红的，后面四个点都红的，过渡的边缘都是不一样的。
所以一般情况下，美工会按照iphone6的图像的给我们一个psd（视觉处理图），我们根据视觉处理图来编程， iphone6屏就是ratina屏，就是按照ratina屏（视网膜屏）的物理像素给我们图片的尺寸。
为了让机器展示出一样的，就把这个物理像素转成逻辑像素，就要除以dpr。如果我们面对的是ios，要把它给你的尺寸除以2 ，美工给你的图以iphone6 的dpr=2的设备，除以2就换成了逻辑像素，设备会给你乘以2会变成最终的那个像素点数，所以点数不会丢。我们也管用css编程的逻辑像素方式叫做逻辑屏幕。逻辑屏就是正常填充css像素的操作系统会根据逻辑屏的像素数再根据设备的dpr，来帮我们转换实际的物理像素。你设置了多少个逻辑像素，就需要拿多少个物理像素来实现这个逻辑像素。换句话说就是，css逻辑像素就是一个虚拟值。
如果逻辑屏是100px100px，那么dpr=2的情况下物理屏为200px200px，这就是逻辑屏转换成物理屏。编写就是逻辑像素，css里面的px是逻辑像素。
还有我们衡量一个屏幕的好坏，展示的色彩是否丰富，我们不看分辨率。分辨率19201080，它表示的是在固定宽高下展示的像素点数。它不太容易能够看出好或坏。比如分辨率19201080，在手机上横向有1920个像素点，纵向有1080个像素点，其实展示像素点不重要，你要看机器是多大的。假设这个机器是6in8in，那么对角线为10in，那如果对角线2in，分别率也是这么大，清晰度是不一样的，肯定2in的清晰度好。所以说我们要看dpi，那分辨l中19201080是怎么乘的呢？比如说屏幕为360dpi（ppi），它是2.5in，那360dpi*2.5in = 横向就是横向的数，纵向就是纵向的数。当然1920/2.5in ||1080/..in得出的横向dpi和纵向dpi是一样的，不存在横向dpi和纵向dpi是不一样的。
如果面试官问：像素多大啊？点距约等于像素每个设备点距不一样，物理像素不一样，逻辑像素和物理像素之间是有转换关系的。
若有收获，就点个赞吧
0 人点赞
