在设计前端页面时，常常会遇到这种情况：可滚动容器的边界并非父容器的边界，导致子元素溢出造成裁切，让页面产生比较怪异的视觉效果（左图） 添加遮罩之后，效果自然了许多（右图） 纯色遮罩 以上图的这种情况举例 …

我是一名来自中国的大二学生，对Web开发非常感兴趣。在我大一的时候，我加入了一个技术社团（杭电助手），这可以说是让我接触编程和开源的一个起点。在杭电助手，我遇到了一群和我志同道合、对开发充满热情的同学，也正是在于他们交流的过程中，我在2023年初了解到了 Google Summer of Code。

Original Post I’m a sophomore from China passionate about web development. In my first year, I joined a technical club at our college. This club was my introduction to coding and open source. In the c …

最近在给自己写主页（同时也是博客），我做了一个切换主题色的功能。每次进入页面时，会随机选择一套配色，让页面显得灵动一些，就像下面这样： 这是如何实现的呢？不妨先从自定义颜色入手 WindiCSS 自定义颜色 定义 …

这两道题真是太有趣了！虽然标签是逆向，但是以前端为载体，有很多JS/CSS奇淫巧计，我已经迫不及待地想要和大家分享了。 Treasure Map 题目地址：http://treasure.chal.pwni.ng/ Ready your masts and set sail! Tha …

这篇文章主要介绍名片页的路由过渡是如何去做的 介绍 在19年，我就写了一个较为炫酷的个人名片页。当时的我热衷于使用各种过渡效果，当然，也尝试了很多新鲜的 css 特性，例如为了实现多种主题色使用了 css 变量（好 …

“你这是个技术博客么” “不全是” “那怎么只有技术文章” “……” 我很少对玩过的游戏发表看法，但是今天要推荐的这款游戏 Hi-Fi RUSH，它实在是太好玩了。Hi-Fi RUSH 是 Tango 开发的一款动作游戏。在今年1月底就发售了， …

背景 在Manifest V3中，谷歌对CSP策略的限制变得更加严格。例如，不允许使用unsafe-inline指令，这避免扩展执行远程代码，然而，这也意味着注入到页面中隔离环境的Content Scripts受到了扩展CSP策略的约束。因此，当 …

在 windicss 中，提供了媒体查询和 class 两种方式实现暗黑模式适配。而且比较省心的是——其提供的 dark 变体会自动根据选择的适配模式，生成对应的代码，可以有效避免写出一堆没用的css，看起来也比较清晰。 为了方 …

这是掘金网页版的头部，当滚动条向下滑动时，主header会隐藏，次级header会吸在页面顶部。 样式 首先，我们先通过两个 div 来模拟这两个header 这里使用绝对定位来将两个header固定在页面顶部，这两个div分别是main- …