在HTML里，全局属性就像一把通用钥匙。不管你是用div、p、button还是自己定义的元素，这些属性都能给它们加上额外功能。从最简单的id和class，到现代网页用的popover和inert，全局属性让你不用写复杂JS就能做出丰富的交互效果。

2026年，CSS已经不是那个“只能改颜色”的工具了。下面这几个特性能让你少写很多JS，而且性能更好。:has() — 终于能选中父元素了。以前想根据子元素状态改变父元素的样式，只能靠JS。现在不用了。场景：表单校验时，输入框的父容器变红

视频明明在网页里放着，用户一切到别的标签页，内容就“失踪”了。这种体验我一直不太接受。尤其是后台盯监控、边查文档边看直播、边记笔记边听课程这类场景，明明浏览器已经有现成能力，很多前端页面还在自己搓悬浮窗，越做越重。

有时候点开一个活动页，第一眼就觉得不对劲：图不是加载失败那种糊，是故意糊，而且带着一格一格的颗粒感。这个东西你要是上滤镜、写canvas、再搞截图重绘，路子就走偏了。想把网页做成“像素风”，CSS往往三行就够，剩下的反而是你怎么控制作用范围。

如果你写过 tooltip、下拉菜单或者弹窗，应该遇到过这种情况：用 JS 去拿元素位置，监听滚动和窗口大小变化，还要处理边界溢出，代码写起来又长又难维护。现在 CSS 原生提供了一个叫 Anchor Positioning（锚点定位）的特性

你有没有过这样的经历：为了一个吸顶效果，折腾几十行 JS；为了一个自适应间距，写了无数个 @media 断点；为了做一个弹层，反复算 offsetTop。其实，很多你曾经以为必须用 JavaScript 才能解决的交互

你是不是还在用 for 循环遍历数组？还在写一堆 if-else 判断空值？还在 setTimeout 里套 setTimeout 处理异步？说实话，2026 年了，有些 JS 代码真的可以不用再那么写了。那些曾经要写 10 行才能搞定的逻辑，现在 2 行就够了。

你可能遇到过这种情况：页面看起来不复杂，但首屏加载就是慢半拍。很多时候，问题不在框架，不在后端，也不在于“再上一个性能插件”，而在于我们没有把足够的信息告诉浏览器。

以前做滚动动画，一看代码里有scroll监听、getBoundingClientRect()、节流、防抖，还要自己算进度条，我就知道后面要麻烦了。不是说不能写。是这种代码一多，动画、性能、后面好不好改

很多人觉得 Skills 就是写得长一点、整齐一点的 Prompt。这个想法不对，就像把跑车当成自行车骑——能用，但本事根本没使出来。你把一个功能做成 Skill 之后，它就成了你 AI 助手里的“肌肉记忆”。

逗号操作符就是用来在一个表达式里执行多个操作，然后只取最后一个的结果。虽然平时不常用，但知道这个知识点有两个好处：看别人代码时不会懵，特别是for循环里的写法，面试时如果被问到，能答得上来

做网页的时候，很多效果我们总想着用JavaScript去实现。其实CSS早就有了更好的办法。下面这14个技巧，能帮你省掉很多重复代码。写代码的时候多想想，说不定三行CSS就能解决的事，不用写几十行JS。