css

Vue3 零基础每日笔记（071）：暗黑模式与主题切换——CSS 变量 + Element Plus 暗黑方案Element Plus 实战篇收官篇。064 篇说过组件库颜色全靠 CSS 变量——本篇吃透这套变量体系：一行引入暗黑模式、一个组合式函数管切换、一个输入框换主题色，让 068 篇的后台骨架白天黑夜都好看。

《Qt从零入门系列（十三）：QSS样式表详解——从选择器与层叠规则到控件美化实战》QSS，是Qt框架专属的界面样式描述语言。设计思路直接借鉴了前端那套CSS，核心使命就一个，给Qt的各种控件做美化。文字颜色、边框圆角、背景图片，再到悬浮、点击这些交互状态，统统能用QSS搞定。

程序员大阳

副队长CSS教程(30)–CSS Grid 实战：实现复杂自适应表单布局传统使用 Flex 写复杂表单，需要大量嵌套标签、手动控制宽度、处理换行错位，代码冗余且极易错乱。而 CSS Grid 二维网格布局可以单层标签完成多列、跨行、通栏布局，结构极简、排版规整、自适应能力拉满，是复杂表单的最优实现方案。

程序员大阳

副队长CSS教程(29)–CSS Grid 实战：实现通用图文混排布局传统实现图文混排大多使用浮动、Flex 布局，浮动会出现塌陷问题，Flex 实现图文排版虽然可行，但无法轻松实现图片、文字高度自动对齐、整体规整统一的效果。

React Native for OpenHarmony 实战：三方库 react-native-popup-menu 的鸿蒙化适配指南本文记录把 react-native-popup-menu 适配到 HarmonyOS 的完整过程。这个库是目前遇到的最省事的一个：纯 JS、零运行时依赖、没有 prepare、main 指向的 rollup 产物与上游逐字节一致。接入几乎不需要动脑。

【每天一个CSS | Day19】流光文字与一笔写成的手写签名昨天我们做了一只拟物怀表——金属、皮革、厚度，都是“实体”的质感。今天做两个“笔画级”的文字效果：看起来是两个不相干的效果，其实本质完全一样：

统一对象拓扑（UOT）设计全链定稿：从三件事分离到三继承之1 20261010（豆包“查看聊天内容”继续）摘要：本文围绕一套统一对象拓扑（UOT）的整体设计展开，核心是把界面呈现、内容表达、行为表现三件事分离，再通过统一过程统合为泛化结构、公共逻辑、统一行为。全文从三件事分离出发，逐步厘清 field 的三重身份与三翻译（字段/场/域），确立 column、ambient、domain 三词，并延伸到语言表达力、三个根本算子（勾/等/兑）、原生基元（框/圆/块）、结语三定与形式化工序。随后推进到程序模板三类、三对偶、线面体空间三层次、相应/对应/分别三论，以及四义位（表面义/引申义/隐喻义/字面义 = den

React Native for OpenHarmony 实战：三方库 react-native-css-transformer 的鸿蒙化适配指南本文记录把 react-native-css-transformer 适配到 HarmonyOS 的完整过程。

CSS transform 转换详解：translate、rotate、scale、skew 与 3D 变换一次讲清transform 是 CSS3 里最像“魔法”的属性之一：它能在不改变文档流、不影响其他元素布局的前提下，让元素平移、旋转、缩放、倾斜。

三天不学习

Tailwind CSS 快速入门（2026 版）：从 v4 零配置上手，到「该不该用、怎么用好」的选型实战摘要：Tailwind 的入门教程满地都是，但大多数停在「装好、写几个 class、好神奇」。本文想做的是另一件事：先帮你建立正确的心智模型，再给你一份真的能跑起来的最小工程，最后回答那个绕不开的问题——我到底该不该用它。全文分三层：① 破除四个流行误会，讲清 Tailwind 的本质是「约束式设计系统」而不是「换皮 Bootstrap」；② 用 Vite + Tailwind v4 跑通一个 5 分钟最小示例，并讲透 v4 的三大变化（CSS-first 配置、自动内容检测、原生级联层）；③ 正面对比

前端阶梯——第九章、颜色、文本与背景上一章我们解决了两个地基问题：样式的选择器怎么写、两条规则打架谁说了算。但还有一半没讲——选中了元素，到底能把它改成什么样？

前端阶梯——第八章、CSS入门与选择器上一章结尾，你写出了人生第一个"结构规范"的新闻页。但它长这样：黑字白底、宋体字号、所有东西从上往下堆——能看，但不好看。

页面中心圆圈放大效果如何写整页正中一颗深色圆，灰圈从它身上长出来，边大边淡，散没了又来一轮。样式在 css/circlePulse.css，页面是 index.html，没有脚本。

被摘下的星星

CSS 基础说明作用：把 CSS 样式应用到 HTML 上。示例：选择器 { 属性: 值; }含义：选择器：告诉浏览器“要选中哪些元素”。

网页文字滚动效果如何做导航下的通知条、页脚合作单位、活动页中奖名单，都要在一块不大的区域里把字滚起来。本页按常见需求给了五种：单行从左往右、多行从上往下、列表无缝横向、名单无缝纵向、公告一次只露一条并往上换。单行和多行只依赖 jQuery；列表无缝还要 jquery.SuperSlide.2.1.1.js。脚本都写在 js/textScroll.js，jQuery、SuperSlide、业务脚本这个顺序不能反。

拆解网页的底层逻辑：用费曼学习法讲透 HTML 与 CSS想象一下，你打开一个新闻网站：左侧是铺满正文的文章区，右侧是整齐的目录和标签栏，顶部还有导航。这个看似平常的页面，背后其实是两套语言在默契分工——HTML 负责搭建骨架，决定页面里有什么、各自是什么角色；CSS 负责赋予血肉与风格，决定这些东西看起来怎么样、摆在哪里。本文就从这里出发，用费曼式的讲解方式，把网页拆开讲给自己听，帮助你在理解中真正掌握前端基础。

多图片上传预览功能如何写发帖配图、商品相册都常见：点加号选图，旁边马上出现缩略图，鼠标移上去可以设为首图或删除。本例最多 5 张，只接受 jpg、jpeg、png、gif、bmp。先在浏览器里预览，真正发给服务器放在最后一节。

悬停旋转放大和位移效果如何写产品列表里图片要放大，头像要转一圈，卡片要往上抬——这些都是 transform 加 :hover。样式在 css/hoverTransform.css，页面在 index.html 里给块加上对应类就行，不用脚本。

windplay网页创意实验场WindPlay 是一个网页创意实验场，收录点云人像、粒子动画、交互艺术和小游戏。这里的每个作品都可以独立开发与构建，也可以随着想法成熟继续扩展。

设计稿是 #4A7C6F，页面量出来是 #4B7C6F：HEX、HSL、透明度、canvas 来回转的七个坑上周和设计对颜色，设计稿上写的是 hsl(164, 25%, 39%)，我在页面里量出来是 #4B7C6F，设计给的品牌色却是 #4A7C6F，差了一个 R。两个人对着屏幕看了半天，肉眼根本看不出区别，但 UI 自动化截图对比一跑就报差异。