什么是网格视图? 很多网页都是基于网格设计的，这说明网页是按列来布局的。 使用网格视图有助于我们设计网页。这让我们向网页添加元素变的更简单。 响应式网格视图通常是 12 列，宽度为100%，在浏览器窗口大小调整时会自动伸缩。 创建响应式网格视图 接下来我们来创建一个响应式网格视图。 首先确保所有的 HTML 元素都有 box-sizing 属性且设置为 border-box 。 确保边距和边框包含在元素的宽度和高度间。 添加如下代码： * { box-sizing: border-box;} 查看更...

响应式 Web 设计 - Viewport 什么是 Viewport? viewport 是用户网页的可视区域。 viewport 翻译为中文可以叫做视区。 手机浏览器是把页面放在一个虚拟的窗口（viewport）中，通常这个虚拟的窗口（viewport）比屏幕宽，这样就不用把每个网页挤到很小的窗口中（这样会破坏没有针对手机浏览器优化的网页的布局），用户可以通过平移和缩放来看网页的不同部分。 设置 Viewport 一个常用的针对移动网页优化过的页面的 viewport meta 标签大致如下： widt...