效果图展示 代码部分 代码说明、注解 使用了 CSS 的一些属性： :after 伪类 position 定位 border-radius 圆角边框 linear-gradient 背景颜色渐变 di

因为 button 元素可以使用 before/after 伪元素，所以借助伪元素，可以实现动态图中的遮盖层。 为了避免回流重绘，滑箱的运动方向是垂直方向，所以使用scaleY属性。对于动画的方向，需要借助transform-origin改变动画原点。 果冻特效可以分割成 5 …

看这篇博文总结，详细点这里 本文只作为阅读这篇博文的阅读笔记 方法一 多行文本截断，超出部分省略号 提到限制行数，超出部分省略号显示，我们常用的就是display: -webkit-box 这里就是

大家好，我是 Steven。 打开 CodePen 编辑器，新增一个 <div>，class 是 container；在里面新增三个 <div>，class 是 drop，代表滴下的水点。 在 CSS 那边，新增 .container 选择器，display…

自从react16.8，react-hooks诞生以来，在工作中一直使用hooks，一年多的时间里，接触的react项目，渐渐使用function无状态组件代替了classs声明的有状态组件，期间也总结了一些心得。尤其对于近期三个月的项目里，一点点用自定义hooks来处理公司项…

下面我将选择进行划分为三大部分，对于基本选择器我就不说了，主要讲下伪类选择器，组合选择器及它们各自的使用场景。 下面讲讲nth-child()括号中的公式，这个算是这个选择器的亮点了。 上面这两我就不说了，相信大家都用烂了。主要说说下面这两个。 好了，在讲完这些选择器之后我们来…

所谓‘伪元素’，就是本身不存在的页面元素，HTML代码里并没有这样的元素，但在页面显示时，你却能看到这些本来不存在的元素发挥着作用。本文主要探究伪元素beforce和after的常用使用场景。 :before 选择器向选定的元素前插入内容。 使用content 属性来指定要插入…

顾名思义。。计数, 可以用来统计某个函数的执行次数，也可以传入一个参数，并且根据传入的参数分组统计调用的次数 断言，用来进行条件判断。当表达式为 false 时，则显示错误信息，不会中断程序执行。 $(selector)是原生 document.querySelector() …