很多人觉得CSS就是写写颜色、调调边距。其实现在CSS已经很强大了，很多以前必须用JavaScript才能做的交互，现在纯CSS就能搞定。这篇文章整理了现代CSS里最实用的技巧

试着用原生的HTML5和浏览器API重新写了一遍。结果你猜怎么着？代码量直接少了八成。没有虚拟DOM，没有打包工具，没有node_modules那一大堆东西。而且跑得比原来还快。

现在很多人用AI写东西，默认都是用Markdown。它简单、好上手，连代码块都能正常显示。但随着AI能力变强，Markdown的一些问题也开始暴露出来。最大的问题是：内容一多就不好看。上百行Markdown读起来很累。

做前端开发，图片处理是最容易出问题的地方。很多人觉得图片不就是写个src就能显示吗？等上线以后才发现，页面加载慢、搜索抓不到、屏幕阅读器读不出来，甚至页面还会来回跳动。

布局与溢出：解决90%布局bug,做页面最头疼的就是布局错乱、文字溢出，这几个属性直接封神，少走很多弯路。很多交互bug（点击穿透、文字被选中、移动端延迟），其实一个CSS属性就能解决，不用写多余JS。

不是用JavaScript，不是用Sass，就是纯CSS。比如“给每个卡片一个随机背景色”，或者“让雪花随机飘落”。听起来很简单对吧？但如果你试过，你就知道CSS做不到。

<permission> 是一个正在讨论中的 HTML 新元素。它想把“向用户申请权限”这件事，从 JavaScript 函数调用变成一个页面上真实可见的控件。目前这个提案还处于 WICG 草案阶段，经历过 Chrome 的 Origin Trial 测试，距离成为正式标准还有一段路

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

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

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

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

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