通过分流方式实现响应式网站比纯 CSS @media 方式实现响应式更好？看淘宝等网站如何实现响应式网站

设计与前端的关系比较紧密，如何在日常工作中更加高效的进行合作，一直是双方共同追求的目标。高效的合作方式，应该是双方具备专业上的共识、能进行有效的沟通、以及对效率工具的运用。

本文主要对 CSS 布局中常见的经典问题进行简单说明，并提供相关解决方案的参考链接，涉及到三栏式布局，负 margin，清除浮动，居中布局，响应式设计，Flexbox 布局，等等。

视口单位（ Viewport units ) vw : 1vw 等于视口宽度的 1% vh : 1vh 等于视口高度的 1% vmin : 选取 vw 和 vh 中最小的那个 vmax : 选取 vw 和 vh 中最大的那个 转自凹凸实验室（https://aotu.io/notes/2017/04/28/2017-4-28-CSS-viewport-units/）

第一种方法使用 border 属性 hack 出三角形，并通过对三个元素进行拼接最终实现了平行四边形；而第二种方法则通过 transform: skew 来得到平行四边形。总体来说，第二种方法相对于第一种代码量小得多，而且也很好理解。唯一的不足是无法构造像本站的分页中所使用的梯形。希望本文对各位有所帮助。

knowledge 前端(Not just)工程师终究要掌握的知识 GitHub地址：https://github.com/HcySunYang/knowledge Intro 该项目收藏积累了前端(Not just)所应该掌握的知识，包括 JavaScript语言基础、DOM…

CSS 布局经典问题初步整理