设为Flex布局的容器，都会默认存在两个轴，水平的主轴(main axis)和垂直的交叉轴(cross axis)。 下面将详细介绍以上属性。 space-around: 每个项目两侧的间隔相等。 stretch: 如果项目未设置高度或设为auto，将占满整个容器的高度。 st…

比如下图中，有的列表项的文字短，有的文字长。 需求是：希望文字长的部分能通过动画滚动显示。 我的第一反应是用纯 CSS 做不了。 其中涉及了一些有趣 CSS 知识点，在这里分享一下。 1. 如何让文字溢出容器？ work-break 属性是用来处理文字如何换行的，这里使用了不太…

效果如其名，想必都见过下雪（可能南方人除外哈哈），但下雪效果只是一类效果的名称，可以是红包雨等一些自由落体的运动效果，本文就是用纯css模拟下雪的效果。 由于公司产品的活动，需要模拟类似下雪的效果。浏览器实现动画无非css3和canvas（还有gif），对比下css3和canv…

CSS Sprites在国内很多人叫css精灵/css雪碧图(啥都行)，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。加速的关键，不是降低质量，而是减少个数 …

在前端开发中，表格组件相对来讲是比较复杂的组件之一，主要原因在于大家对表格组件的需求不同，笔者没看到过一个表格组件可以覆盖所有人的需求。 从业务场景来讲，可以把表格组件分成三种类型： Bootstrap 类：CSS 就可实现的表格，主要用在信息展现类的页面上。 中后台类：着重在…

在移动端，利用H5技术，可实现微杂志,微信邀请函,H5小游戏等营销互动等应用开发，本文将介绍一种Create.js与Adobe Animate CC结合来制作H5落地页的方法。 通过两者结合既充份利用了Create.js的便捷性控制逻辑和整体框架结构，又充份应用了Animate…