屏幕适配应当指内容 适配区 和 屏幕区 间的适配关系。 单屏适配有 contain、cover 或 fill，多屏常见是 依宽 。 contain 和 cover 还需要 定位 来处理留白和超出的内容。 而同一个 H5 里不同内容往往用不同适配方式，即 分层。 对于屏幕适配这类…

写在前面 之前写了两篇前端图片相关的内容（前端ps切图方法，图文详细,css sprite雪碧图制作，使用以及相关，图文gif），本文是面向前端小白的，搜集整理的一些切图技巧，及其相关内容。 关于版本： 推荐pscc2017版，一些老版本很多新功能没有，会影响到效率的。（目前2…

本文暂时列举了 13 条技巧，1、resize 实现图片对比 2、:not() 的应用技巧 3、任意元素垂直居中 4、表格单元格等宽 5、使用 Flexbox 摆脱各种 Margin Hacks 6、给空连接使用属性选择符 7、初始化 box-sizing 8、在 nth-child 中使用负数 9、文本显示优化（待商榷）10、border 的应用技巧！11、vertical-align 属性 12、margin 重叠解决方案列举 13、父元素 font-size:0 的作用 等！

写在前面： 在网页制作中，雪碧图也是前端攻城狮必须掌握的一项小技能。百度词条对雪碧图的解释是：CSS雪碧 即CSS Sprite，也有人叫它CSS精灵，是一种CSS图像合并技术，该方法是将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分。本文主…