在页面布局中，我们经常会遇到/使用这么一类常见的布局，也就是列表内容水平居中于容器中，像是这样： 效果如下： 这里，外层的容器是定宽的，内层的 flex-item 也是定宽的。 当 flex-item

多行文本展开收起是一个很常见的交互， 如下图演示 实现这一类布局和交互难点主要有以下几点 位于多行文本右下角的“展开收起”按钮 “展开”和“收起”两种状态的切换 当文本不超过指定行数时，不显示“展开收

CSS Gird布局也叫二维网格布局系统，可用于布局页面主要的区域布局或小型组件。网格是一组相交的水平线和垂直线，它定义了网格的列和行。我们可以指定将网格元素放置在与这些行和列相关的位置上。

在实际 Web 开发过程中，总会遇到各种各样的布局。有公司同事问我这样一种布局有没有什么好的实现方式，就是一种在活动充值页非常普遍的优惠券效果，如下 首先，碰到这类布局的最佳实现肯定是mask遮罩。关于遮罩，可以看一下CSS3 Mask 安利报告。这里简单介绍一下 这里的遮罩图…

之前写过这样一篇文章：CSS 实现多行文本“展开收起”，介绍了一些纯 CSS 实现多行文本展开收起的小技巧，特别是右下角的“展开收起”按钮，用到了浮动布局，非常巧妙，有兴趣的可以回顾一下。 原本以为已

前言 其实在大部分的项目中都有 直接 或 间接 使用到 SVG 和 Canvas，但是在大多数时候我们只是选择 简单了解 或 直接跳过，这有问题吗？没有问题，毕竟砖还是要搬的！ 话说回来，前端其实还是

前言 手指双击页面时候也会放大 检查了下，功能上没有什么大问题，但是页面会整体放大，而且失去焦点之后页面不能返回原来的样子。用户体验不好 最后找到原因：苹果觉得点击输入框放大是一个“很好”的体验，就擅