- 博客(9)
- 收藏
- 关注
RSS订阅原创 CSS混合模式：设计效果新维度
Styled-components性能优化。服务端渲染 hydration 策略。保持至少一个图层为高对比度。移动端设备需测试性能影响。运行时与编译时方案对比。避免在正文文本上使用。
2025-08-07 08:41:17
408
原创 现代CSS重置方案全解析
动态滤镜组合方案（包含与伪元素的创意组合技巧）：暴力清零，需要完全重建样式。：修复不一致但保留合理默认值。边距/字体继承规则差异。
2025-08-05 10:12:08
340
原创 CSS性能优化：从入门到精通
内联, ID, 类/伪类, 元素] = [1, 0, 0, 0]纯CSS实现复杂UI效果。动态内容生成的边界技巧。性能与创意的平衡之道。
2025-07-18 00:00:00
454
原创 CSS变量实战：让样式更智能
CSS变量实战指南摘要：本文系统介绍了CSS变量的核心应用，包括基础声明（:root全局变量）、作用域机制（局部覆盖全局）和动态主题切换实现（通过JS修改body类名）。重点展示了响应式设计应用（媒体查询结合变量）与预处理器的本质区别（运行时vs编译时）。高级技巧涵盖变量默认值设置、动态计算（calc）和JS控制动画。实战案例包括按钮系统构建和实时属性编辑器，最后给出渐进增强、性能优化和设计系统构建等最佳实践。全文以代码示例驱动，突出CSS变量在动态样式管理和主题定制中的强大能力。
2025-07-04 00:00:00
364
原创 Grid入门：网格布局速成指南
* 或 inline-grid *//* 列定义 *//* 行定义 */gap: 15px;/* 行列间距，替代旧的grid-gap *//* 重复模式 *//* 自动填充 *//* 命名网格线 */
2025-06-27 00:00:00
571
原创 Flexbox布局全攻略：从入门到精通
动画属性优先使用transform而非flex-grow。（cross axis）：与主轴垂直的轴。点击布局标签页中的Flexbox图标。轴向控制灵活（水平/垂直自由切换）避免超过1000个Flex项目。：需借助负margin或JS。（main axis）：由。复杂布局建议使用Grid。：需要各种hack手段。：媒体查询代码量庞大。
2025-06-20 09:10:42
376
原创 CSS 前端：基础到实战
CSS (Cascading Style Sheets) 是用来描述 HTML 文档样式的语言。它控制网页的外观和布局，让内容与表现分离。：先写移动端样式，再通过媒体查询增强大屏体验。(选择 h1 后所有同级的 p 元素)(只选择 div 的直接子元素 p)(选择紧接在 h1 后的 p 元素)(选择 div 内所有 p 元素)：保持 HTML 和 CSS 分离。padding（内边距）：使用有意义的类名（如。content（内容）margin（外边距）border（边框）
2025-06-13 10:51:54
301
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人