如下图所示，卡片布局是我们常见的一种页面布局

如下图所示，卡片布局是我们常见的一种页面布局。

瀑布流也是一种很常见的布局，尤其是在图片信息流的产品，以往如果要完美的实现瀑布流，我们需要费不少的功夫，还要借助JS进行实现。本案例，将使用 column-count 这个属性，进行实现。

布局相同高度的列，也是我们业务中常见的需求，如下图所示：

两列布局，左边是导航栏目，右边是内容部分。尤其在后台的场景，是非常常用的。如下图所示：

接下来我们使用弹性布局的方式，灵活实现网格布局，如下图所示：

类似在IPAD上的分屏业务场景，两个应用平分屏幕进行显示，如下图所示：

在网页设计中，Sticky footers设计是最古老和最常见的效果之一，大多数人都曾经经历过。它可以概括如下：如果页面内容不够长的时候，页脚块粘贴在视窗底部；如果内容足够长时，页脚块会被内容向下推送。如下图所示：

在实际业务中经常碰到页头固定在浏览器的顶部，如下图所示：

内容区域的吸附效果也是一种很常见的效果，如下图所示：

今天的文章就分享到这里，希望对你日常的业务有所帮助，感谢你的阅读。