在工作中，有时会遇到需要一些不能使用分页方式来加载列表数据的业务情况，对于此，我们称这种列表叫做长列表。比如，在一些外汇交易系统中，前端会实时的展示用户的持仓情况(收益、亏损、手数等)，此时对于用户的持仓列表一般是不能分页的。 在高性能渲染十万条数据(时间分片)一文中，提到了可…

传统内容增强通过滤镜、标签、贴纸等手段丰富和提升内容的表现力，在抖音快手短视频大行其道的信息快速消费时代，如何通过有趣的玩法，好玩的特效降低用户的创作成本，提高内容表现形态和张力，是目前内容社区可以借鉴和思考的方向之一。 在千篇一律的社区内容Feed流里，Timeline上的一…

又到了金三银四面试季，这里我整理了... 欸！？不好意思，跑题了... 感觉近来掘金首页全是面试相关的内容，我是打开掘金也不知道该看啥，实在无奈。 上个礼拜看了许多关于平面构成的资料，我就边用 CSS 画了一些类似背景图案的玩意儿。这里给大家选了12种，从观察者的角度由易到难的…

周日在家看 web.dev 的 2020 三天 live，发现不少有意思的东西，其中有一项是关于 CSS 的，主播是 Una Kravets（chrome team 成员）。虽然我已经好几个月没有深入研究 CSS 的东西了，不过以前的底子还在（有兴趣的可以看我一年前发布的关于 …

前几天，同事接到一个积分商城项目，其中有一个卡券兑换礼品功能。我想了一会没什么好的思路，就忙自己的项目去了。但想到以后自己可能也会遇到类似的需求，所以周末学习整理了下几种卡券效果的实现。

实现前端数字滚动效果效果如下：代码如下：

当我学完css和js后，冒出来一个想法。自己去实现一个可爱的卡通人物。于是我就去codepen找素材，最终选择了皮卡丘，如下图。 在开始写皮卡丘之前，我先观察了皮卡丘的整个页面。发现如果要很好的实现这个皮卡丘你不能像写传统网页那样从左到右布局，而是要从中间布局，因为左右两边对称…

display:-webkit-box;必须结合的属性，将对象作为弹性伸缩盒子模型显示。 -webkit-box-orient;必须结合的属性，设置或检索伸缩盒对象的子元素的排列方式。 text-overflow:ellipsis;可选属性，可以用来多行文本的情况下，用省略号“…