48张图带你从0到1掌握flex布局方式。 需要本文的Xmind导图的话，移步公众号--前端UpUp,回复flex关键字即可。 从上面图来看，我们将flex布局分为两部分讲，轴和容器。 打个预防针，flex布局涉及到12个CSS属性，父容器,子容器各6个。 接下来先梳理常见的属…

有没有经常遇到一些样式每次写都要用百度呢？我收集了一些我平时经常要用到的但又总是记不住的样式。有错误的地方欢迎指正。转载请注明出处。一、设置input的placeholder的字体样式设置input聚

它不是自然界的物理长度，指基本原色素及其灰度的基本编码。 css中的像素只是一个抽象的单位，在不同的设备或不同的环境中，css中的1px所代表的设备物理像素是不同的。 在为桌面浏览器设计的网页中，我们无需对这个津津计较，但在移动设备上，必须弄明白这点。 在早先的移动设备中，屏幕…

前端开发中还原设计图的重要性毋庸置疑，目前来说应用最多的应该也还是使用rem。然而很多人依然还是处于刀耕火种的时代，要么自己去计算rem值，要么依靠编辑器安装插件转换。 而本文的目标就是通过一系列的配置后，在开发中可以直接使用设计图的尺寸开发，项目为我们自动编译，转换成rem。…

在当代讲究效率的时代，码农的开发效率也一定程度上决定了码农的价值。 来吧，让我来解决你的问题。 由于目前的大部分官网类页面都是全部的静态页面，作为一个项目来开发，选用一个注重数据等的框架是不靠谱的，那么这个时候就不许要用到纯静态开发了。 对于静态页面，工作量最大的莫过于--调样…

Rem布局的原理解析

假设现在图上有个宽度100px的按钮，UI图是750px的图。 答案是我们应该写 100px / 2 = 50px。css里width = 50px; 就这样。 那为什么是100px除以2呢？？？因为iPhone的dpr = 2。 dpr的全称是window.devicePix…

我们可以用红蓝绿可以调配出任何颜色,我们常说的手机像素就是由许多红蓝绿组成的一个小块,1个小块表示1个像素. 上图,横向有7个小块 纵向有7个小块,表示7*7像素. 因为在尺寸没有改变的情况下.物理像素增加.因此css中的1px并不能等于设备的1个物理像素. 目前主流的做法是用…