你可能不需要 javascript

在上一篇 [CSS 如何根据背景色自动切换黑白文字？](CSS 如何根据背景色自动切换黑白文字？ - 掘金 (juejin.cn)) 中，讲述了文本自适应背景色的一些小技巧，不过还存在一定局限性，比如

在项目中，经常会碰到背景色不确定的场景，为了让内容文字足够清晰可见，文字和背景之间需要有足够的对比度。换句话说，当背景是深色时，文字为白色，当背景是浅色时，文字为黑色，就像这样： 通常这种情况，大家可

本文正在参加「金石计划 . 瓜分6万现金大奖」。 最近碰到这样一个问题，在一张封面上直接显示书名，可能会存在书名看不太清楚的情况（容易受到背景干扰），如下 为了解决这个问题，设计师提了一个“究极”方案

本文正在参加「金石计划 . 瓜分6万现金大奖」。 尝试一下用 CSS 绘制简单的 3d 图形，比如一个掘金 logo？ 相比 2d 绘制，3d 有哪些需要注意的小细节呢？一起看看吧 一、金字塔形/四棱

本文正在参加「金石计划 . 瓜分6万现金大奖」。 众所周知，函数节流（throttle）是 JS 中一个非常常见的优化手段，可以有效的避免函数过于频繁的执行。 举个例子：一个保存按钮，为了避免重复提交

介绍两个和滚动定位相关的 CSS 属性：scroll-padding和 scroll-margin 在平时开发中，经常会碰到需要快速定位的问题，比如常见的锚点定位 这样，在点击a标签时会自动定位到与之

Ant-design 中有一个这样的头像组件，当字符串较长时，字体大小可以根据头像宽度自动调整，效果如下 当然，这里是通过JS根据字符数量自动缩放文本实现的 而现在，仅仅通过 CSS也能达到类似的效果

众所周知，macOS 的滚动容器中默认会有一个“触底反弹”效果，也就是常说的“橡皮筋”效果，如下 通常情况下，反弹效果可以反映出是否滚动到了边界，让滚动体验更加丝滑，算是一种体验的提升，但是如果页面总

我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第1篇文章，点击查看活动详情 通常情况下，hover 是无法保存状态的。鼠标移入触发额外样式，一旦移出就还原了 这就意味着，如果需要保留hover

前不久在这篇文章：CSS 有了:has伪类可以做些什么中介绍了:has伪类的一些使用场景，可以说大大颠覆了 CSS 选择器的认知，让很多繁琐的 js逻辑通过灵活的CSS轻易实现了。这次带来一个比较常见

平时工作中很多场合都要用到定时器，比如延迟加载、定时查询等等，但定时器的控制有时候会有些许麻烦，比如鼠标移入停止、移出再重新开始。这次介绍几个借助 CSS 来更好的控制定时器的方法，一起了解一下吧，相

不得不说，CSS 计数器是个好东西。 最近在几篇文章中都用到了 CSS 计数器，可以将 CSS 变量通过伪元素content动态展示出来，还可以做出很多有趣的动画。有兴趣的可以先回顾一下之前的这几篇文

在某条 APP 中，如果长按点赞，会出现这样花里胡哨的动画，如下 这个动画有两部分组成，其中这个随机表情的实现可以参考 coco 的这篇文章 巧用 transition 实现短视频 APP 点赞动画

介绍一个 CSS 动画合成小技巧。先看效果 这是一个非常“动感”的倒计时效果，通常在一些活动开场中比较常见，分析一下整个动画过程，不难发现，有以下几类动画 数字的变化 缩小和放大 透明度变化 不知道小

在网页中，经常会用阴影来突出层级关系，特别是顶部导航，但有时候设计觉得没必要一开始就显示阴影，只有滚动后才出现。比如下面这个例子，注意观察头部阴影 可以看到，只有滚动以后才出现阴影。一般情况下，使用

很多页面布局，特别是那种工具类的、比如编辑器、可视化平台等，为了充分的利用屏幕空间，都会提供拖拽调节各个分栏尺寸的功能，比如像 vscode 抽象开来，其实就是这样一个布局 你也可以先看实际效果：CS

介绍一个通过 CSS 变量自动更改样式的小技巧~ 偶尔在网上看到这样一个设计，当阅读量比较少时，文字呈灰色，当阅读量比较多（>=100）时，文字就变成褐色了，示意效果如下 是不是非常醒目呢？ 另外，还

最近在项目中碰到了一个这样的树状结构目录，效果如下 代码片段如下 CSS tree (juejin.cn) 如果用到了 Ant Design 这样的框架，那可以直接用现成的组件。如果没有用到这样的框架

我正在参加 码上掘金体验活动，详情：show出你的创意代码块 练习 CSS 一个很好的方法就是绘制各式各样的 UI，比如这样一个时钟？ CSS clock CSS 绘制这样一个布局有几个难点： 环形排

最近在 MDN 官网看到了一个从未见过的选择器，::target-text。 简单研究了一下，觉得还有点意思，也有点实际用处，现在分享一下。 一、::target-text 是干什么的 想必大家都用过