- 博客(15)
- 收藏
- 关注
RSS订阅原创 使用 button 和 popover 属性模拟下拉选择框
使用 button 元素和 popover 全局属性实现一个更灵活、更可控的下拉选择框。
2025-11-22 16:37:35
789
原创 CSS 的成长故事：从 1994~2025
三十年前，Håkon 的一封邮件宣告“内容表现分离”的诞生；几经浏览器混战与 CSS2.1 的拨乱反正，CSS 在 2011 年站稳脚跟；随后模块化取代版本号，Zen Garden 与响应式设计点燃社区，Flexbox、Grid、自定义属性三大革命重塑布局；如今 @layer、:has()、容器查询、嵌套、新色彩空间等现代特性以火箭速度落地，配合 Sass/PostCSS 工具链，CSS 已不仅是“网页衣装”，而是演进不息、驱动体验的核心引擎。
2025-09-18 22:55:37
588
原创 你可能忽视的 HTML 元素：前端必看的完整清单
很多前端开发者在日常工作中只用到常见的 HTML 标签，却忽略了大量能提升语义、优化体验的元素。本文为你整理了一份完整的 HTML 元素清单，从结构标签到交互组件，从文本标记到多媒体支持，每个部分都配有示例与使用要点。通过这份指南，你不仅能快速查找所需标签，还能理解它们的语义价值与应用场景，避免常见误区。无论你是初学者，还是在寻找进阶技巧的开发者，这份清单都能成为你的高效参考工具。
2025-09-14 15:31:28
652
原创 用原生 ＜dialog＞ 打造可访问、无依赖的对话框
仅用 <dialog> 与 CSS，即可实现可访问、无依赖的模态与非模态弹窗。文章梳理元素定义、属性速查、JS API 与表单集成技巧，附完整示例代码，直接粘贴即可用。
2025-09-12 17:02:15
326
原创 使用 HTML 的 details 元素实现几个常见效果
用原生 <details> 实现两种常见交互：FAQ 折叠面板与纯 CSS 选项卡，无需 JavaScript。文中给出完整 HTML 结构、可复制的 CSS 及动态效果 GIF，直接粘贴即可用，体积最小，兼容现代浏览器。
2025-09-11 14:26:17
152
原创 你不知道的 HTML 文档头与元数据元素
全面介绍了HTML文档中的关键元素及其应用，从基础的<html>、<head>元素到各种元数据元素如<title>、<meta>、<link>和<script>。内容涵盖了元素定义、技术规范、属性详解和最佳实践，特别强调了如何通过这些元素优化网页性能、提升SEO效果和增强社交媒体分享体验。文档详细讲解了viewport设置、字符编码声明、资源预加载、样式表管理、脚本加载策略等实用技术，并提供了大量代码示例。
2025-08-27 16:35:41
1089
原创 实现网站换肤效果的几种方式
本文章详细介绍了网站换肤效果的实现，方式1：可能出现样式闪动（不是 bug）；方式2：使用 CSS 变量实现，不涉及样式表的切换，也就不存在样式的闪动，推荐使用方式2实现换肤效果！
2025-08-23 10:47:19
250
原创 掌握CSS属性值语法：避免无效样式的关键技巧
CSS属性值定义语法是一套用于精确描述CSS属性合法取值及组合方式的规则系统，它确保了样式声明的有效性和一致性。这套语法由组件值类型、组合符和乘数三大部分构成：组件值类型：包括关键字、字面量和数据类型，用于定义可接受的基本值。组合符：控制不同值的组合逻辑，并遵循严格的优先级规则。乘数：用于限定值的重复次数。此外，范围表示法可约束数值的有效区间，确保声明符合预期。理解这套语法体系，能帮助开发者编写更严谨、可维护的CSS代码，避免无效样式声明。
2025-08-19 14:36:38
843
原创 前端必学：CSS规则集与样式表组织全解析
本文系统解析CSS的核心概念与技术体系。CSS作为定义结构化文档视觉与听觉表现的标准语言，通过分离内容与样式实现高效维护。其演进历经CSS1-CSS3模块化发展，现进入持续迭代阶段，覆盖排版布局、动态效果、媒介适配等维度。核心规则集由选择器与声明块构成：选择器通过元素/类/伪类等精准定位元素；声明块包含属性-值对，使用冒号连接和分号分隔。样式表支持内联、内部和外部三种引入方式，其中@import因性能问题需谨慎使用。注释采用/* */语法，支持多行说明但禁止嵌套。
2025-08-18 16:12:47
917
原创 前端开发者必备手册：字符引用、URL结构与渲染优化实战
本文全面解析前端开发中的核心知识体系：从HTML字符引用（命名字符实体与数字编码的转换规则）到URL的标准化结构与解析逻辑，深入探讨语义化标签对SEO优化的实际影响，并结合搜索引擎收录机制分析内容优化策略。通过分解浏览器渲染流程（DOM构建、图层合成与GPU加速），揭示性能优化的关键节点，同时提供Emmet语法的高效编码技巧与开发者工具的实战用法。无论是初学者还是资深开发者，都能从中掌握提升代码质量、优化页面性能的系统化方法。
2025-08-17 12:45:49
852
原创 HTML从入门到精通：元素、属性与实战详解
本文系统梳理HTML的核心技术体系，从基础定义到现代标准演进：首先解析HTML5的定位——作为超文本标记语言，通过标签定义网页结构与语义，与CSS/JavaScript构成Web开发三大支柱。随后追溯其发展历程，从1989年Tim Berners-Lee创建初稿到HTML5成为W3C标准，并最终由WHATWG维护动态更新。重点详解元素结构与空元素特性，并分类讲解全局属性、ARIA可访问性属性、事件处理器及自定义数据属性。最后深入元素内容模型分类及交互特性，辅以代码示例说明嵌套规则与语义化实践。
2025-08-15 15:05:53
715
原创 Web技术全景图：从三剑客到浏览器渲染，前端开发者必备的基础认知
Web发展始于1989年Tim Berners-Lee发明万维网，历经浏览器大战、Web 2.0交互革命，到现代前端工程化（React/Vue）与高性能技术（WebAssembly）。网页由HTML（结构）、CSS（样式）、JS（交互）构成，网站则是网页的集合。用户访问时，浏览器通过DNS解析域名，建立HTTPS连接，请求资源后渲染；开发者需编写三剑客代码，经Webpack打包部署到服务器。浏览器负责解析与安全控制，服务器处理请求并返回数据，二者协作实现Web全流程。
2025-08-13 13:58:27
791
原创 前端工程师入门指南：从开发认知到VSCode高效配置
这篇技术文章系统介绍了前端开发的核心知识体系：从基础认知（软件与应用程序开发的区别）到架构选型（C/S与B/S架构对比），再到开发环境搭建（Windows配置+VSCode优化）。重点讲解了前端工程师的技术实现职责（HTML/CSS/JS框架应用）和用户体验保障，并提供了开箱即用的VSCode配置方案（主题/插件/代码片段）和效率工具链（Chrome/Xmind/Typora）。文章最后通过对比表格和配置示例，帮助开发者快速搭建高效的前端工作环境。
2025-08-12 14:41:07
995
原创 现代计算机的DNA：从冯·诺依曼架构到图灵完备性 | 前端开发者必知的基础通识
冯·诺依曼提出存储程序架构，奠定现代计算机五大部件基础（运算器、控制器、存储器、输入输出设备）；图灵创立可计算性理论，定义计算机科学核心框架。计算机本质是自动处理数据、存储信息、执行指令的电子设备。硬件由处理器（CPU/GPU）、存储设备（内存/外存）、输入输出组件构成；软件分为系统软件（操作系统/驱动）和应用软件（办公/设计工具）。核心操作技巧包括文件管理快捷键（复制/粘贴/重命名）及浏览器高效控制（新建/恢复标签页）。
2025-08-11 13:18:33
946
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人