css3

CSS文字渐变CSS本身没有对于文字的渐变色支持，我们常见的渐变色一般都是背景色渐变。但如今的很多前端展示场景，出于美观的目的，都需要有渐变文字。

CSS 全栈指南：从基础到 2025 新特性从层叠规则到现代布局，从自定义属性到容器查询，系统梳理 CSS 全栈知识，涵盖 W3C 2025 最新特性，助你写出优雅、高性能的样式代码。

Predestination王瀞潞

6.5.2 软件-＞W3C HTML5、CSS3标准（W3C Recommendation）：HTML（HyperText Markup Language）HTML（超文本标记语言，HyperText Markup Language）是构建网页结构的核心语言，它不是编程语言，而是标记语言—— 通过一系列「标签」描述网页的结构和内容（如标题、段落、图片、链接等），浏览器会解析这些标签并渲染出可视化的网页

Predestination王瀞潞

6.5.3 软件-＞W3C HTML5、CSS3标准（W3C Recommendation）：Selector网页选择器网页中的 Selector（选择器）是一套标准化的语法规则，用于精准定位 HTML/XML 文档中的任意元素（如按钮、文本、图片、表单等），它是前端开发（CSS/JS）、爬虫开发（数据提取）的核心工具，主流分为 CSS 选择器（最常用）和 XPath 选择器（功能更强），下面分模块详细讲解

Predestination王瀞潞

6.5.1 软件-＞W3C HTML5、CSS3标准（W3C Recommendation）：CSS（Cascading Style Sheet）CSS（层叠样式表，Cascading Style Sheets）是用来描述 HTML/XML 文档呈现样式的语言，核心作用是分离结构（HTML）和样式（CSS），让网页的外观设计更灵活、维护更方便

有趣味的登录页它踏着七彩祥云来了最近，有一个比较火的很有趣且灵动的登录页火了。已经有大神（katavii）复刻了动画效果，并在github上开源了：https://github.com/katavii/animated-login ，基于React实现。

什么是 Tailwind CSSTailwind CSS 是一个原子化 CSS 框架（Utility-First CSS Framework）。

CSS 外边距（margin）全解析：取值规则 + 实战用法CSS 外边距（margin）是控制元素与其他元素之间间距的核心属性，通过灵活设置 margin 值，可优化页面元素的布局间距，避免元素紧贴在一起。本文结合极简实战代码，详解 margin 的核心用法和取值规则，新手可直接复制上手。

CSS 边框（border）全解析：样式 / 宽度 / 颜色 / 方向取值CSS 边框（border）是美化元素的基础属性，可通过单独设置宽度、样式、颜色，或使用简写属性快速定义边框效果，还能为四条边设置不同样式。本文详解边框的核心用法和方向取值规则，新手可直接复制代码上手。

CSS 内边距（padding）全解析：取值规则 + 表格实战CSS 内边距（padding）是控制元素内容与边框之间间距的核心属性，支持按方向灵活设置间距，尤其适合优化表格、按钮、卡片等元素的排版。本文结合表格实战案例，详解 padding 的取值规则，新手可直接复制代码上手。

CSS 字体样式全解析：字体类型 / 大小 / 粗细 / 样式CSS 字体样式是控制网页文字外观的核心，通过font-family、font-size、font-weight、font-style等属性，可快速定义文字的字体、大小、粗细和斜体效果。本文结合极简实战代码，详解字体样式的核心用法，新手可直接复制上手。

CSS 三种引入方式全解析：行内 / 内部 / 外部样式表（附优先级规则）CSS 控制 HTML 样式有三种核心引入方式：行内样式、内部样式表、外部样式表，不同方式适用于不同场景，且遵循明确的优先级规则。本文结合实战代码，详解三种方式的用法、差异及优先级，新手可直接复制代码上手练习。

CSS 浮动（float）全解析：布局 / 文字环绕 / 清除浮动CSS 浮动（float）是经典的布局方式，核心作用是让元素脱离正常文档流实现横向排列，同时支持文字环绕效果。本文详解浮动的定义、用法、文字环绕特性及清除浮动的核心方法，新手可直接复制代码上手。

CSS 文本样式全解析：颜色 / 对齐 / 装饰 / 缩进CSS 文本样式是控制网页文字展示效果的核心，通过color、text-align、text-decoration、text-indent等属性，可快速实现文字颜色、对齐方式、装饰线、首行缩进等效果。本文结合实战代码，详解文本样式的核心用法，新手可直接复制上手。

解决 `:first-child` / `:last-child` 不生效的问题在开发 Vue 或小程序项目时，我们经常会使用 CSS 伪类选择器 :first-child 和 :last-child 来选中某个容器内的第一个或最后一个子元素。然而，有时你会发现这两个选择器并没有按预期工作。本文将通过一个典型示例，分析原因并提供几种可靠的解决方案。

CSS 文本对齐方式实战：text-align 核心用法CSS 的text-align属性是控制文本水平对齐的核心，仅需一行代码就能实现左对齐、居中、右对齐、两端对齐等效果，是网页排版中最常用的样式之一。本文结合极简实战代码，详解text-align的核心用法。

CSS display 属性全解析：块级 / 行内 / 行内块 / 隐藏CSS 的display属性是控制元素显示类型的核心，通过修改display值，可灵活切换元素的布局特性（块级、行内、行内块），甚至隐藏元素。本文结合实战代码，详解display的 4 个核心取值及应用场景，新手可直接复制上手。

Sass：让 CSS 从手工作坊迈入工业时代Sass：让 CSS 从手工作坊迈入工业时代> 写过原生CSS的都知道，那感觉就像用手工织布机——重复、枯燥、还容易出错。没有变量，没有复用，一个颜色改十遍，一个选择器写八遍。今天我们就来学习Sass，这个CSS预处理器的扛把子，让你的样式代码像现代工厂一样高效、可维护。

Sass 进阶：当 CSS 学会了编程，变量函数循环全都安排上昨天我们用Sass告别了手工作坊，学会了变量和嵌套。今天咱们继续深入，看看Sass还有哪些骚操作——模块化、内置函数、条件循环，让你的CSS代码像程序一样聪明。准备好，我们要从“会用”进化到“玩出花”了。

解决 SVG 作为 CSS 背景图无法 background-size: 100% 100% 拉伸的问题在 Vue 或 Element Plus 项目中，为容器（如 .el-table__header）设置 SVG 背景图时，即使指定了 background-size: 100% 100%，SVG 依然保持原始比例，导致两侧留白或显示不全，无法自适应拉伸。