- 前端 HTML 语义化与文档结构HTML 不只是让页面“看起来正确”的标记语言，也描述了内容之间的关系和控件的用途。语义清楚的文档更容易被浏览器、搜索引擎、辅助技术和后续维护者理解。页面结构越复杂，语义带来的价值越明显。 一、用元素表达内容角色标题、导航、主要内容、侧栏和页脚应使用对应的结构元素。页面主内容通常使用一个 main，独立文章可以用 article，相关分组可以用 sectio... 前端 HTML 语义化与文档结构HTML 不只是让页面“看起来正确”的标记语言，也描述了内容之间的关系和控件的用途。语义清楚的文档更容易被浏览器、搜索引擎、辅助技术和后续维护者理解。页面结构越复杂，语义带来的价值越明显。 一、用元素表达内容角色标题、导航、主要内容、侧栏和页脚应使用对应的结构元素。页面主内容通常使用一个 main，独立文章可以用 article，相关分组可以用 sectio...
- 一、项目介绍贪吃蛇是一款经典的小游戏。玩家通过方向键控制蛇的移动，吃掉食物后蛇身会变长，同时游戏得分增加。如果蛇撞到墙壁或者自己的身体，游戏就会结束。本项目具有以下特点：纯前端实现：只使用 HTML、CSS 和 JavaScript。无需图片：使用 Canvas 绘制蛇、食物和游戏背景。无需依赖：不需要安装第三方库，也不需要服务器。支持键盘操作：使用方向键或 WASD 控制移动。完整游戏功能... 一、项目介绍贪吃蛇是一款经典的小游戏。玩家通过方向键控制蛇的移动，吃掉食物后蛇身会变长，同时游戏得分增加。如果蛇撞到墙壁或者自己的身体，游戏就会结束。本项目具有以下特点：纯前端实现：只使用 HTML、CSS 和 JavaScript。无需图片：使用 Canvas 绘制蛇、食物和游戏背景。无需依赖：不需要安装第三方库，也不需要服务器。支持键盘操作：使用方向键或 WASD 控制移动。完整游戏功能...
- ## 起因每天手动上华为云成长中心签到、做任务领积分，说实话挺烦的。打开浏览器、登录、点签到、发文章、查积分……一套流程下来十几分钟就没了。作为一个懒出天际的程序员，我决定把这事儿自动化掉。目标很明确：登录 → 签到 → 做任务 → 记积分，全程脚本跑完，我喝咖啡就行。## 环境openEuler 22.03 LTS，ARM64 架构的机器。没有 apt-get，装东西得用 dnf。Play... ## 起因每天手动上华为云成长中心签到、做任务领积分，说实话挺烦的。打开浏览器、登录、点签到、发文章、查积分……一套流程下来十几分钟就没了。作为一个懒出天际的程序员，我决定把这事儿自动化掉。目标很明确：登录 → 签到 → 做任务 → 记积分，全程脚本跑完，我喝咖啡就行。## 环境openEuler 22.03 LTS，ARM64 架构的机器。没有 apt-get，装东西得用 dnf。Play...
- 不依赖任何框架，用单个 HTML 文件实现可玩的 2048，并梳理棋盘状态、合并算法与动画冲突的处理方式。 不依赖任何框架，用单个 HTML 文件实现可玩的 2048，并梳理棋盘状态、合并算法与动画冲突的处理方式。
- <h2>前言：一个反直觉的现象</h2><p>同样是「屏幕上有 1000 个元素在动」这件事，用 DOM 写，帧率很容易掉到 20 帧；换成 Canvas 之后，同样 1000 个圆点却能跑满 60 帧。于是很多人得出一个结论：<strong>Canvas 比 DOM 快</strong>。</p><p>这个结论不算错，但它只是结果，不是原因。真正的原因是：Canvas 走的是<strong... <h2>前言：一个反直觉的现象</h2><p>同样是「屏幕上有 1000 个元素在动」这件事，用 DOM 写，帧率很容易掉到 20 帧；换成 Canvas 之后，同样 1000 个圆点却能跑满 60 帧。于是很多人得出一个结论：<strong>Canvas 比 DOM 快</strong>。</p><p>这个结论不算错，但它只是结果，不是原因。真正的原因是：Canvas 走的是<strong...
- 前端 Web 安全与 XSS 防护浏览器会执行页面中的脚本。若攻击者能把可执行内容注入页面，就可能读取页面数据、伪造用户操作或影响其他用户。前端安全需要从数据来源、输出位置和权限边界共同考虑。 一、识别不可信输入用户输入、接口返回内容、查询参数和第三方内容都应按不可信数据处理。即使接口来自自家服务，也要考虑数据被错误写入或被其他账号提交的情况。展示普通文本时使用框架默认的文本插值或 DOM... 前端 Web 安全与 XSS 防护浏览器会执行页面中的脚本。若攻击者能把可执行内容注入页面，就可能读取页面数据、伪造用户操作或影响其他用户。前端安全需要从数据来源、输出位置和权限边界共同考虑。 一、识别不可信输入用户输入、接口返回内容、查询参数和第三方内容都应按不可信数据处理。即使接口来自自家服务，也要考虑数据被错误写入或被其他账号提交的情况。展示普通文本时使用框架默认的文本插值或 DOM...
- 好家伙，一个 HTML 页面现在也能玩到这种程度了。最近刷到一个挺有意思的开源项目：floorplan-3d GitHub 仓库。打开之后不是普通网页，而是一个完整的户型装修设计工具。2D 平面图、3D 场景、家具摆放、光照模拟，全塞进浏览器里了。平面模式下，可以直接拖家具家电进去摆，目前有 60 多种模型。桌子、沙发、床这些拖进去之后还能自动吸附墙面，尺寸精确到毫米。墙体也不是只能看看，非... 好家伙，一个 HTML 页面现在也能玩到这种程度了。最近刷到一个挺有意思的开源项目：floorplan-3d GitHub 仓库。打开之后不是普通网页，而是一个完整的户型装修设计工具。2D 平面图、3D 场景、家具摆放、光照模拟，全塞进浏览器里了。平面模式下，可以直接拖家具家电进去摆，目前有 60 多种模型。桌子、沙发、床这些拖进去之后还能自动吸附墙面，尺寸精确到毫米。墙体也不是只能看看，非...
- ## 一、两条缓存路径浏览器请求资源时先查本地缓存，分两种命中方式：- **强缓存**：直接读本地，**不发请求**，状态码 200（from disk cache / memory cache）- **协商缓存**：发请求到服务端问"这个还能用吗"，能用回 **304 Not Modified**，只回响应头不带 body两者的区别就是"要不要问服务端"。强缓存快但更新滞后，协商缓存每次都... ## 一、两条缓存路径浏览器请求资源时先查本地缓存，分两种命中方式：- **强缓存**：直接读本地，**不发请求**，状态码 200（from disk cache / memory cache）- **协商缓存**：发请求到服务端问"这个还能用吗"，能用回 **304 Not Modified**，只回响应头不带 body两者的区别就是"要不要问服务端"。强缓存快但更新滞后，协商缓存每次都...
- Hermes使用图片模型，如image2.5做图片汇报不如直接HTML，方便快速，特别适合固定任务，如软件更新 Hermes使用图片模型，如image2.5做图片汇报不如直接HTML，方便快速，特别适合固定任务，如软件更新
- 今天做了一个叫“茶歇时刻”的单文件网页：米色背景、一个标题、三张提醒卡片。页面只展示文字，因此把 HTML 和 CSS 放在同一个文件中，没有加入 JavaScript。这里记录卡片布局的处理方式。先确定内容顺序页面先放 h1 标题和说明，再用一个容器装三张卡片。每张卡片包含 h2 和一句话：“放下屏幕”“喝一杯水”“看看窗外”。标题层级与阅读顺序一致，改文案时也容易找到位置。用 Flex ... 今天做了一个叫“茶歇时刻”的单文件网页：米色背景、一个标题、三张提醒卡片。页面只展示文字，因此把 HTML 和 CSS 放在同一个文件中，没有加入 JavaScript。这里记录卡片布局的处理方式。先确定内容顺序页面先放 h1 标题和说明，再用一个容器装三张卡片。每张卡片包含 h2 和一句话：“放下屏幕”“喝一杯水”“看看窗外”。标题层级与阅读顺序一致，改文案时也容易找到位置。用 Flex ...
- 让 Hermes用图片比文字介绍好多了 文字天天发一大串 让 Hermes用图片比文字介绍好多了 文字天天发一大串
- ## 一、先记住三者的关系每个函数都有 `prototype`，每个对象都有 `__proto__`，对象默认还有个 `constructor` 指回构造函数：```jsfunction Person(name) { this.name = name;}const tom = new Person('Tom');```三者的指向规则：- `Person.prototype` → 原型对象（... ## 一、先记住三者的关系每个函数都有 `prototype`，每个对象都有 `__proto__`，对象默认还有个 `constructor` 指回构造函数：```jsfunction Person(name) { this.name = name;}const tom = new Person('Tom');```三者的指向规则：- `Person.prototype` → 原型对象（...
- 实测 HeyGen 开源的 hyperframes：纯 HTML + GSAP 时间线渲染成 MP4，无构建步骤、本地渲染不要 API key。附 6 秒 720p 视频实跑全记录、渲染原理与踩坑实录。 实测 HeyGen 开源的 hyperframes：纯 HTML + GSAP 时间线渲染成 MP4，无构建步骤、本地渲染不要 API key。附 6 秒 720p 视频实跑全记录、渲染原理与踩坑实录。
- 前言网页链接提取，传入网页地址即可获取网页内的全部链接，并按图片、CSS、JS、HTML、音视频、文档、压缩包、PHP 等类型分类返回，便于快速梳理页面资源与内外链结构。网页链接提取可广泛应用在 SEO 分析、数据采集、安全检测等场景，比如：SEO 与网站分析：批量提取页面中的内外链资源，用于死链排查、外链分析与站点结构优化。数据采集与内容聚合：获取目标网页的链接集合，为爬虫调度、内容聚合... 前言网页链接提取，传入网页地址即可获取网页内的全部链接，并按图片、CSS、JS、HTML、音视频、文档、压缩包、PHP 等类型分类返回，便于快速梳理页面资源与内外链结构。网页链接提取可广泛应用在 SEO 分析、数据采集、安全检测等场景，比如：SEO 与网站分析：批量提取页面中的内外链资源，用于死链排查、外链分析与站点结构优化。数据采集与内容聚合：获取目标网页的链接集合，为爬虫调度、内容聚合...
- 2026年AI设计稿转代码指南：从HTML到iOS/Android实战核心结论：2026年的设计稿转代码（D2C）已经分化为两条清晰路线。 如果你追求“快”，用通用AI工具直接上传截图或Figma链接，几分钟内就能拿到可运行的HTML或React代码；如果你追求“准”，需要利用Figma MCP（模型上下文协议）让AI读取结构化的设计数据，生成更工程化的代码。对于原生移动端，专门的工具链（... 2026年AI设计稿转代码指南：从HTML到iOS/Android实战核心结论：2026年的设计稿转代码（D2C）已经分化为两条清晰路线。 如果你追求“快”，用通用AI工具直接上传截图或Figma链接，几分钟内就能拿到可运行的HTML或React代码；如果你追求“准”，需要利用Figma MCP（模型上下文协议）让AI读取结构化的设计数据，生成更工程化的代码。对于原生移动端，专门的工具链（...
上滑加载中
推荐直播
-
华为云码道Agent集成与鸿蒙实战2026/08/11 周二 19:00-21:00
王一男-华为云码道产品规划专家；李炎-华为云码道产品专家；彭江敏-华为云鸿蒙端云一体化开发专家
本次直播带你解读华为云码道7月份产品新特性、新功能。更有专家演示码道Agent Space × 钉钉机器集成实战，从0到1打通消息通道；码道鸿蒙端云一体化实战，快速搭建员工签到系统。
回顾中 -
华为云开发者AI素养直播课·第五期2026/09/04 周五 16:00-18:00
林华鼎-华为云AI开发者运营负责人；蒋春阳-华为云AI开发者案例开发专家
本期直播内容： AI工具体验营 · 第5-8课连讲。Agent-Team 多智能体协作完成毕业设计实践
回顾中 -
华为云开发者AI素养ClassRoom·第六期2026/09/08 周二 19:00-20:00
樊渊-2026华为软件挑战赛冠军
高手来了：看软挑高手解析二维排样问题—从工业难题到算法突破
回顾中
热门标签