在刷抖音的时候，发现有一个直播的专属导航页签，切换到这个页签之后，刷出来的内容全都是直播，不过都是在“门外”观看，没有进入直播间； 短暂的停留之后，会出现一个自动进入直播间的提示，并且有一个描边动画，

前不久看到这样一个很有趣的效果，它的滚动条是沿着圆角边缘滚动的，效果如下 你可以查看原链接来体验一下 这是如何实现的呢？ 原效果中由于为了兼容不支持CSS滚动驱动的浏览器，特意用 JS做了兼容，所以看

-想学习CSS技能，但不知道从何下手的 - 想简单复习一下CSS技能 - 最近有意愿做官网项目的 - 纯前端开发，有意向入门后端，希望能独立做一套完整但是又不复杂的前后端项目以上几种就可以点开了~

前言 SVG想必大家都非常熟悉，即使没有写过，也多多少少听过。写一些简单的动画或者交互，是绕不开的一种语言，但是它最大的问题就是上手比较陡峭，API比较多，使用方式也比较多，很容易在中间迷失。

本文将会通过svg实现圆形进度条和矩形进度条以及三角形进度条，先放效果图 圆环进度条 首先我们需要两个画两个圆，一个是底色圆，一个是进度圆。 现在就画好了两个圆，绘制进度圆的重点就是d属性值 ，M代表

利用 stroke-dasharray 和 stroke-dashoffset 来实现进度效果。

本文将介绍 CSS 中一个非常有意思的属性 mask 。 顾名思义，mask 译为遮罩。在 CSS 中，mask 属性允许使用者通过遮罩或者裁切特定区域的图片的方式来隐藏一个元素的部分或者全部可见区域。 其实 mask 的出现已经有一段时间了，只是没有特别多实用的场景，在实战中…

只有你想不到，没有 css 做不到。今日分享只由 css 实现的效果 - weather 以下是为效果图的所有实现源码，因为 css 内容较长，相关 css 可以点击查看展开阅读。 点击访问 这里 查看源码，并附有 codepen 在线编辑为您带来不一样的体验。可以点个 sta…