本期为 FE Bits 前端周周谈创刊号，精选并总结了过去一周全球泛前端生态的新动向、重要技术动态、文章推荐、工具和代码库更新，以及深入分析几篇行业高质量内容。

CSS 布局另外的半壁江山！Grid 网格布局 —— 二维自由排布，碾压一维 Flex 的存在。核心概念、属性全解析，附实战案例，轻松搞定复杂页面布局。速学这一强大工具，布局难题迎刃而解！

1前言 你有没有过这样的经历？想让元素们排排站，结果它们却像脱缰的野马到处乱窜？今天咱们就来聊聊 CSS 里最让人又爱又恨的 "调皮鬼"—— 浮动（float）。 什么是浮动？其实是个 "游泳健将"

在网页设计中，浮动（Float）是一项历史悠久但依然实用的布局技术。它最初用于实现文字环绕图片的效果，如今已演变为构建网页布局的重要工具。

作为一名前端开发者，我们一定都遇到过这样的需求：实现一个占满整个屏幕的欢迎页、弹窗蒙层或者一个 fixed 定位的底部菜单。 直觉告诉我们，这很简单，给它一个 `height: 100vh` 就行了

引言 在前端开发面试中，"请解释CSS盒子模型"这个问题出现的频率几乎高达90%。作为前端开发的基石，盒子模型不仅是一个常见的面试题，更是我们日常开发中必须掌握的核心概念。本文将带你全面理解CSS盒子

通过 Flex + Transform 实现无第三方依赖的极简轮播；底部信息层使用绝对定位 + 伪元素营造“浮起”的圆角效果；再配合响应式断点，兼顾桌面与移动端。JavaScript 仅 20 行左右

前言 大家好，最近作者在做项目，中途发现前段时间学习的CSS，特别是弹性布局等内容，已经有点遗忘了， 于是作者准备再温习一下这些知识，并且应用一下，于是作者就有个想法：学习一下掘金APP的源码，并且试

写了这么多年CSS，我发现有个现象很有意思：有些我们每天都在用的属性，我们以为自己很熟，但其实可能只用了它10%的功能。background-image就是最典型的一个。 大部分时候，我们对它的使用场

前端技术的发展速度，快得让人焦虑。我们每天都在学习新的框架、新的工具，但同样重要的，是关注语言本身——CSS和JavaScript——正在发生的变化。 这篇文章，不想聊那些你已经熟练掌握的技术。我们来

Vue实现一个“液态玻璃”效果登录卡片 效果介绍 液态玻璃（Liquid Glass）是一种极具现代感的UI视觉风格，常见于高端网站和操作系统界面。它通过多层叠加、模糊、光泽、滤镜等技术，模拟出玻璃的

今天咱们就来一次CSS的“庖丁解牛”，用大白话把那些面试常客的难点、痛点，一条条、一桩桩给你捋清楚！准备好了没？咱们这就启程，一起把CSS的“老底”给掀了！

Vue 开发者可能都注意到，UnoCSS 的讨论频率越来越高。它不像 Tailwind 那样有营销声势，不像 Windi 那样起得早，却在 2024 年之后逐渐“渗透”进越来越多的 Vue 项目中。很

我们最近刚把一个后台系统从 element-plus 切成了完全自研组件，CSS 层统一用 Tailwind。全员同意设计稿一致性提升了，但代码里怨言开始冒出来。 这篇文章不讲原理，直接上代码对比和团

在 CSS 的 linear-gradient 语法中，角度的计算是有规律的： 0deg：渐变角度为0度，表示渐变线“从下到上”——也就是颜色从底部开始到顶部结束。 90deg：渐变线“从左到右”——

从0.5px边框、小字体限制到刘海屏定位错位，提供transform缩放、JS动态计算、自定义字体等实战解决方案，彻底解决安卓/iOS兼容性问题，让页面精准适配所有机型！

金金金上线！ 话不多，只讲你能听懂的前端知识 什么是 CSS 选择器？ 常见的 CSS 选择器有哪些？ 选择器 是干啥的 元素选择器（如 p） 根据标签名选择所有该类型的元素 类选择器（如 .high

CSS过渡适用于简单的两状态变化，需要触发事件；动画支持多关键帧，可自动循环播放。优化建议包括：优先使用transform/opacity、减少动画区域、启用硬件加速、避免过多动画以提升性能。

头疼样式冲突、全局污染？CSS Modules（.module.css）来救场！自动隔离样式、生成唯一类名，轻松搞定复用与冲突，让前端样式管理高效又省心。