Flexbox 与 Grid 布局：基础概念与特点 Flexbox 比如创建一个简单的水平导航栏 Grid 超简单的一个例子： 这里的fr是一个特殊单位，表示网格容器中可用空间的等分数。除了fr，还可

本文大纲： 剔除冗余 CSS 代码的业界方案对比 介绍 PurgeCSS 核心原理 检测工具 前言 随着业务不断的迭代，我们的页面中出现了越来越多冗余的代码。这些冗余的代码，既占用 CDN 带宽，也会

wc!!!你不会还在用flex布局吧，都2024年了快进来看看css3最强布局Grid布局 绝对让你眼前一亮

在前端开发中，实现水平垂直居中在Flex布局下有一个更灵活的方式——使用 margin: auto;`来实现居中以及更多实际场景下的特定效果。

新的 CSS 属性 margin-trim CSS 中最烦人的事情之一就是边距。它们与折叠有奇怪的相互作用，并且通常会在您不想要的地方产生额外的间距。当迁移到基于组件的设计系统时，这会变得更加痛苦，因

在这个不为人知的CSS Overflow教程中，你将学到如何处理元素溢出的内容，以及如何利用它们来创建出色的用户体验。此外，还包括如何处理内联元素和块级元素的溢出内容，以及如何应对特定情况下的溢出问题

flex 布局作为开发中的常规手段，使用起来简直不要太爽。其特点： 相对于常规布局（float, position），它具备更高的灵活性； 相对于 grid 布局，它具有更强的兼容性； 使用简单，几个

压缩项目打包后的体积大小、提升打包速度，是前端性能优化中非常重要的环节，笔者结合工作中的实践总结，梳理出一些常规且有效的性能优化建议

当面试官问如何能点击图片下的按钮时，不是问的JS事件委托，而是想看你是否知道css的【事件穿透】属性，一行代码搞定