方法一：使用 CSS 边框 (border) 这是最常见且最简单的方法，利用 CSS 边框的特性来创建三角形。 代码解释: 原理: 当一个元素的 width 和 height 都设置为 0 时，元素的

作为一个眼中有码的人，看见某个网页或者app的炫酷效果时，第一反应就是这怎么实现的。这个系列就是把自己见到的一些动画效果分析实现出来，本文分析实现的某些效果，仅仅作为一个思路分享，仅仅作为学习素材使用。闲话不说，这篇文章是前端动画系列的第一篇。 作为一个轻度伪球迷，经常会看些赛…

起因 在网上冲浪时看到了一个非常炫酷得效果，自我学习掌握后又开发出来得长虹玻璃效果，第一时间分享给大家！ 什么是长虹玻璃效果(Fluted) 简单得说就是类似透过磨砂玻璃看物体时得效果，具体表现为垂直

在 bilibili 主站 PC 端，时不时会看到其顶部横幅栏是一个随鼠标变化的动画：我们今天也来实现一下吧

前言 我们有一个需要用到用户的手机号进行一些操作的功能，在这里行文的时候姑且脱敏为：用户输入手机号，我们发短信，这也是经常遇到的功能。 然而有一次，明明用户输入了一个非常正常的手机号（行文中手机号脱敏

详细介绍纯CSS和JS创建漂亮的波浪输入框占位文本动画：逐字显示、颜色渐变和波浪上移的动态效果。为网页提供生动、有趣的输入体验用户在输入时获得更好的视觉反馈。贝塞尔函数给过渡效果带来平滑和流畅的感觉

盼了好久，最近 Chrome 125终于迎来了CSS 锚点定位的正式支持。这是一个和 CSS 滚动驱动动画一样，足以颠覆整个 Web 开发领域的新特性。有了这个特性，很多以前强依赖 JS 的方式，都可

在vue3中使用gasp去实现一个星之卡比的输入框，实现对输入框中的内容进行正则判断，根据正则结果实现不同的动画效果。 本组件是根据gasp官网的案例进行修改copy的

起因 最近公司事情不是太多，我趁着这段时间在网上学习一些Cool~的效果。今天我想和大家分享一个故障时钟的效果。很多时候，一个效果开始看起来很难，但是当你一步步摸索之后，就会发现其实它们只是由一些简单