html标签_AI编程社区

html

码道-诗词飞花令AI对战

摘要（148字）：本文记录了“诗词飞花令 AI 对战网页”的完整开发历程：基于纯前端技术，实现浏览器直连大模型的轻量级互动应用。通过将 Python 流式调用迁移至 JavaScript，设计结构化 JSON 协议，确保 AI 输出可解析、可展示。项目支持自定义关键字、双先手模式、流式对答与智能裁判，融合水墨界面与诗句鉴赏卡，打造沉浸式古典对诗体验。全程零构建、零后端，为浏览器直连大模型提供可复

 zkzk33
2026-09-18 10:38:22

 274

 1

#html #css
码道 | 用提示词当游戏引擎：AI 狼人杀从零到一开发全记录

亮点说明提示词即引擎游戏规则通过提示词描述给 AI，AI 输出 JSON 指令驱动游戏，而非硬编码逻辑JSON 协议设计7 种动作类型覆盖全部游戏阶段，AI 100% 遵循格式差异化 AI 人格7 名 AI 玩家拥有不同性格和发言风格，对局生动不重复流式打字机实时提取 speech 字段，只显示发言内容，不暴露原始 JSON身份保密机制两层保密（座位卡 + 日志），参与模式下不剧透优雅中断 AI

yjb5201314yjb520
2026-09-18 17:01:34

 345

 3

#华为 #css #javascript +1
码道 · 我把「故事接龙」变成了一款纯前端 AI 应用

选型这件事，我几乎没有犹豫。首先是前端框架的问题。Vue、React 都很成熟，但这个项目的交互复杂度其实不高：一个轮流出场的故事流、一个输入框、一组建议标签。用框架会引入构建链，用户拿到源码还得，推广成本立即上升。原生 JavaScript 的代码量完全能驾驭这个规模，还保留了「任何一个会打开浏览器的同学都能读懂源码」的朴素价值。其次是后端的问题。故事接龙需要一个对话式的大模型服务，而 GitC

2601_97020531
2026-09-18 17:53:47

 456

 1

#java #html
码道：「耳遇Musicing」戴上耳机，世界就成了只属于你的梦。

耳遇是一款基于AI的智能音乐推荐应用，通过“场景×性格”双维度匹配（8×8=64种组合），结合DeepSeek-V4-Flash大模型实现流式对话生成结构化歌单。支持实时对话、动态卡片渲染、离线兜底与响应式布局，打造沉浸式音乐体验。零构建部署，纯前端运行，可本地快速体验。

Flora_luluke
2026-09-18 11:35:24

 145

 3

#小程序 #html #javascript
码道：当闹钟遇见大模型——「闹钟计时器 AI 对话」项目开发全记

把时间工具和 AI 塞进同一张网页，看似是功能叠加，实质是交互范式的转变——用户不再"操作界面"，而是"对机器说话"。虽然今天的自然语言指令还很初级，但这个方向让我看到英"对话框即界面"的雏形。回看整个项目，最让我满足的瞬间，不是三组验证用例全部通过的片刻，而是第一次对页面说出"帮我设置早上7点的闹钟"，眼睁睁看着闹钟列表里真的多出一行 07:00 的时候。那一刻，工具终于开始听懂了人话。

2601_96901665
2026-09-18 11:13:28

 332

 1

#html #css #css3
码道 · 你画我猜文字版 AI 对话：让 DeepSeek 用文字作画的纯前端小游戏开发全记录

难度分档：支持"简单词 / 普通词 / 偏门词"三档出题难度，让不同水平的玩家都能玩得尽兴；计时机制：给每轮加一个倒计时，猜得越快加分越多，增加紧张感；服务端代理：把 AI 请求迁到云函数做转发，解决 API Key 暴露问题，顺便增加日志和限流；排行榜：把 localStorage 战绩升级为简单的前后端排行（需要一个轻量后端）；多语言：模型本身支持多语言，把提示词抽成 i18n 配置即可支持英

 zxh121508
2026-09-18 11:57:43

 225

#学习 #html
码道 · 飞花令AI对诗：当千年前的诗词游戏遇上大模型

本文介绍“飞花令·AI对诗”项目，一个纯前端实现的古风诗词对战小游戏。作者以飞花令为载体，结合大语言模型能力，打造可交互的智能对诗体验。项目采用HTML5+CSS3+JavaScript架构，无后端、零部署，通过流式API调用实现与AI实时对战。核心难点在于将Python的SSE流式接口移植至浏览器端，利用ReadableStream与TextDecoder完成数据解析。文章详述技术选型、系统设计

 2601_96901599
2026-09-18 11:17:24

 321

#html
码道 · 数语：当「猜数字」遇上大模型——一个纯前端 AI 对话项目的完整复盘

项目地址：https://atomgit.com/2501_93821753/Shuyuai_Caishuzi.git

Zminn9
2026-09-18 11:20:56

 239

 1

#html #css #华为 +1
码道：从零搭建我的AI助手——记录从零到发布全纪录

回头总结这个项目，真正有价值的东西其实不是代码本身。代码只有一个后端文件、一个前端文件、一份依赖清单，规模小得可怜。真正有价值的是那条被验证过的路径：把模型输出格式变成长久的契约，让生成环节、解析环节、展示环节共享同一份结构。做之前我以为难点在"让模型听话"，做完才明白难点在"让整个链路围绕结构工作"。模型那一环反而是最省心的，给它一份好的 Schema，它大部分时候会给你惊喜；而后端容错、前端渲

 2601_96901916
2026-09-18 11:44:29

 353

#c++#html #css
码道：从需求到上线，用纯前端打造「诗词飞花令」AI 对诗游戏

本文记录了使用华为云 CodeArts 码道，从零打造「诗词飞花令 AI 对诗」纯前端游戏的全过程。项目基于 DeepSeek-V4-Flash 模型，实现流式解析、AI 出题、裁判与对战一体化，通过精心设计的提示词与结构化 JSON 协议，确保规则严谨、交互流畅。全链路无框架、零依赖，单文件即可运行，已开源于 AtomGit，兼具文化趣味与技术示范价值。

Vesper_lirs
2026-09-18 11:10:14

 313

 3

#html #css
码道实战：手把手教你用纯前端调通大模型接口，从零打造“歌词识别“AI 对话应用

基于GitCode AI API的纯前端听歌识曲应用，仅用HTML5+CSS3+JavaScript实现，零依赖、无需构建。用户输入歌词片段或旋律印象，AI通过流式调用DeepSeek-V4-Flash模型，精准识别歌曲并以结构化卡片展示歌名、歌手、专辑、歌词等信息。文章详解从接口认知、页面骨架搭建、流式请求翻译到提示词工程的全流程，手把手带你理解AI对话应用的核心逻辑与实战细节，适合初学者深入掌

 wkpingkun
2026-09-18 10:34:25

 504

 6

#html
码道：当古诗词遇上大模型——诗歌接龙 AI 对话项目从零到发布全记录

它让千年之前的文字游戏，与现代最前沿的智能模型，在同一个页面上完成了握手。你输入"床前明月光"，它回你"光摇银海眩生花"；你输入"欲穷千里目"，它也许回你"目送归鸿手挥五弦"。技术没有温度，但文字有，意境有，文化也有。作为开发者，我们最幸运的事情之一，就是能用代码这种最理性的语言，去守护和传承一种最感性的文化。这就是我的"码道"——以代码为墨，铺一条通往古今的诗路。如果你也对诗词与 AI 的结合感

 2501_94636742
2026-09-18 10:34:39

 280

#html #css #css3
码道 :守岁千年灯火：从零打造「节日习俗AI对话」的思考与记录

「节日习俗AI对话」是一款纯前端轻量项目，以中国传统文化节日为内核，通过大语言模型实现结构化知识输出。项目采用HTML5、CSS3与原生JavaScript构建，不依赖框架，聚焦“技术+文化”融合。核心创新在于将大模型流式响应（SSE）解析为可读JSON，并以古风界面动态渲染节日起源、习俗、诗词等内容。设计遵循“契约式开发”思想，强调提示词工程、容错解析与产品级交互体验，完整呈现从提示词到可视化展

 浅忆0811
2026-09-18 19:57:57

 476

 6

#html
码道 | 从零构建 AI 诗词助手：一次纯前端大模型应用的实践复盘

本文复盘了纯前端构建AI诗词助手的实践：仅用HTML5、CSS3和原生JavaScript，通过系统提示词约束DeepSeek模型返回结构化JSON，实现诗词创作、解析与赏析的古风对话体验。核心创新在于以提示词定义输出契约，配合前端兜底解析逻辑，确保格式稳定；同时将Python流式请求迁移至浏览器fetch，完成零后端部署。项目强调“小而美”，实现双击即用的极致可运行性，揭示大模型应用中提示工程与

 2601_96901567
2026-09-18 21:05:47

 63

 1

#html #css
码道：用大模型做猜歌小游戏｜纯前端流式歌词猜歌名 AI 开发实录

回看整个开发过程，我越发觉得所谓的 "AI 应用开发"，本质上是人机协作的接口设计：你要像对待一个聪明但需要明确指令的伙伴一样，把规则讲清楚、把边界划明白、把输出约束好，剩下的就交给它发挥。而作为开发者，我们要把注意力放在最容易出彩也最容易被忽视的地方 —— 体验的细节：流式的节奏感、思考状态的提示、卡片的层级、失败时的兜底文案。从 "让 AI 和我玩歌词猜歌名" 这个念头，到四个人人都能看懂的静

 IHYAMamg
2026-09-18 11:43:11

 195

 1

#html
Vibe Coding一人即团队系列58: HTML演示文稿自动生成

本文详细阐述了在模式下，一人团队如何利用Claude的Skills机制安装并使用html-ppt工具链，快速生成具备专业视觉水准的 HTML 演示文稿。该方案的核心价值在于将演示文稿的创建纳入代码工作流，通过主题系统（36 套主题）、布局库（31 种布局）及交互式配置，实现了从需求到成品的秒级交付。对于需要频繁迭代内容、强调视觉动效展示的场景（如融资路演、产品发布），html-ppt提供了比传统.

Johnny丶me
2026-09-04 23:30:00

 181

 2

#html #前端 #人工智能
在 Codex 中接入第三方 API：从手动配置到统一切换

文章摘要：本文介绍了在Codex中接入第三方API的三种方法，适用于需要自建网关或多模型管理的用户。方案一通过手动编辑config.toml文件配置；方案二使用Codex++图形界面管理；方案三采用CC Switch工具实现一键切换。重点说明了API密钥安全注意事项和配置验证步骤，并对比了各方案的优缺点。文中以llapi.org为例，演示了具体配置流程，强调第三方服务需自行评估安全性和合规性。

゛刘二柳
2026-08-21 12:19:15

 2429

 23

#人工智能 #html
支持私有化部署的AI开发平台有哪些？企业数据安全选型指南

私有化AI开发平台选型与数据安全指南核心需求：金融、医疗、政企等监管敏感行业对AI开发平台的核心诉求是私有化部署，确保全类产研资产（需求、原型、代码、测试用例等）不流出企业边界。市场现状： AI编程工具（Cursor/Copilot等）多依赖国际云端服务，存在数据出境风险 Agent平台（如BetterYeah）以安全合规为卖点全流程平台（如麦芽AI）支持完整资产私有化，覆盖研发全周期数据

 xujinxing
2026-08-21 11:11:43

 366

 5

#人工智能 #大数据 #知识图谱 +2
AI全流程开发是噱头还是现实？自然语言驱动软件研发拆解

文章摘要（149字）：当前AI全流程开发已实现单环节突破：编码最成熟（Cursor/Copilot），需求整理、原型生成等环节工具可用但需人工校准。核心瓶颈在于环节间"上下文流失"——原型与文档脱节、代码与需求断层。解决方案分两种：工具链拼接（灵活但高维护成本）与全流程平台（如麦芽AI实现需求→代码自动流转）。适用场景排序：MVP开发＞迭代回归＞新项目启动，但深度调优/核心算法仍需专业工具。验证

 xujinxing
2026-08-20 09:22:38

 190

 6

#人工智能 #知识图谱 #python +2
多模态能力深度对比：麦芽AI 图转 HTML 如何重塑研发链路，而纯文本编程工具卡在第一公里

摘要：多模态AI研发平台（如麦芽AI）突破了传统AI编程工具「文本→代码」的局限，通过视觉识别能力实现「设计稿→结构→代码」的全链路自动化，显著提升研发效率。其核心优势在于：1）直接解析Figma等视觉素材，避免信息翻译损耗；2）生成语义化HTML与可维护样式；3）将原型图转化为需求、开发、测试的共享上下文，缩短验证闭环。尽管在复杂动效和业务规则上仍需人工干预，多模态能力已成为处理视觉密集型项目

 xujinxing
2026-08-19 08:46:30

 233

 4

#人工智能 #html #前端 +2
Codex CLI 改代码前要做什么？用测试和 git diff 验收一个小 Bug

本文介绍了使用Codex CLI修复API分页参数bug的完整流程。作者首先明确了需求：让GET /api/books?limit=1返回第一本书，限定了可修改文件范围。在编写失败测试后，尝试通过Codex CLI 0.145.0自动修复，但遇到权限初始化错误导致任务中断。随后采用人工方式完成最小修复：使用Node.js内置URL解析参数、验证limit值并截取结果。通过git diff严格检查变

 ゛刘二柳
2026-08-16 12:04:18

 505

 19

#人工智能 #html
大模型只是知道要调用工具,本身不

ToolMessage(content='北京天气非常好', name='get_weather', tool_call_id='call_00_iWUvgLsMXG29jlpAZTQZ8672')][HumanMessage(content='北京天气怎么样', additional_kwargs={}, response_metadata={}),human_message=HumanMess

scan724
2026-05-30 20:17:06

 250

 5

#前端 #javascript #html
HTML会代替Markdown吗？为什么？

满足这两个条件的只有Markdown，作为轻量级的标记语言，语法上已经尽可能让所有人都能看懂、会用，比如标题用 #，##，###，代表一级、二级、三级标题，这其实稍微熟悉下就会用。大模型也能熟悉这种标记语言，因为有严格的规范，而不是像word那样的富文本，各种排版、格式，没有统一章法，AI很难读出来，需要花大量的token去清洗。HTML因为是结构标准化的文档，虽然也很适合AI读取，但对于AI来说

 朱卫军Python
2026-05-31 22:21:46

 265

 8

#html #前端
颤抖吧！全面Agent时代已经来了！

开发界真的变天了！不仅技术全都变了，招聘也全面发生了变化！现在，不懂Agent，实习都没offer了！最近，找工作的大学生都已经发现了这一点，他们说没有Agent经验就拿不到offer，实习机会都没有，他们说Agent不是加分项，是必须项……

大靠山
2026-05-31 20:10:02

 199

 3

#microsoft #人工智能 #架构 +2
最新YOLO实现的植物病害实时检测平台（Flask+SocketIO+HTML/CSS/JS）

本文实现了一套基于 YOLOv5 至 YOLOv12 的植物病害实时检测平台。系统采用 PyTorch 训练与推理，基于 Flask、Flask-SocketIO 和 HTML/CSS/JS 构建 Web 界面，支持图片、视频、摄像头检测，以及模型切换、权重上传、双画面对比、结果下载、CSV 导出和 SQLite 记录管理。文末提供完整工程与数据集下载链接。

逗逗班学Python
2026-06-01 10:56:37

 440

 12

#flask #python #深度学习 +2
年顶级AI模型html游戏设计大比拼，到底谁才是编码王者？

本文将深入剖析当前顶级AI模型在HTML游戏设计中的表现，通过两段可运行的代码示例，揭示不同模型的编码能力差异，并探讨其背后的技术原理。Claude 3.5的代码更注重物理模拟和交互反馈，例如球速的动态调整和砖块颜色生成，展示了其在游戏设计上的创造性。在性能上，所有模型都能生成可立即运行的代码，但复杂游戏（如带关卡切换的）中，GPT-4的稳定性更优。未来，随着多模态和推理能力的提升，AI模型在游戏

 夏殇之殁
2026-07-28 18:34:50

 231

 7

#人工智能 #html #游戏
千问大模型快速入门与实战指南

文章摘要（145字）：本文为开发者提供大模型接入的实用指南，重点解决"从0到1"的入门难题。内容涵盖：①Python环境准备与账号注册；②模型、Token等核心概念解析；③网页端对话参数调试技巧；④API密钥安全配置方法；⑤智能问答代码示例（含完整Python实现）；⑥提示词优化与多轮对话管理；⑦401/429等常见错误排查；⑧输出异常调参策略。通过场景化演示和代码实例，帮助开发者快速实现基础问

 .Shu.
2026-07-03 17:31:48

 496

 7

#前端 #javascript #html
Product Hunt 每日热榜 | 2026-07-11

Product Hunt 每日热榜 | 2026-07-11 ChatCut是一款轻量级的专业AI视频编辑软件，任何人都可以使用，无需编辑经验。可以把它想象成一个懂得你素材、意图和时间线的个人视频编辑助手。你可以在一个平台上进行结构性编辑、微调剪辑，添加字幕、补拍镜头、音乐、旁白、动态图形、库存视频以及AI生成的视频。每一次编辑都可以在真实的时间线上进行调整，并且如果你想在其他地方继续工作，支持X

LaughingZhu
2026-07-12 22:33:21

 320

 4

#人工智能 #html #经验分享 +1
大模型GEO结构化排版：3个格式逻辑让内容优先被提取，零代码提25%引用率附格式对照表

【GEO排版优化方法论：提升大模型引用率的关键技巧】本文由张钧泽（曌选科技GEO优化主理人）基于20+项目经验总结，揭示排版对AI内容提取效率的显著影响。数据显示，80%的提取失败与排版混乱相关，优化排版可平均提升24%引用率，且无需修改内容本身。核心发现排版影响机制：大模型通过标题层级（H2/H3）、加粗、列表等格式识别内容权重，结构化排版可提升提取准确率至89%（对比未优化的62%）。

问商十三载
2026-07-15 21:19:24

 482

 9

#html #前端
企业AI编程智能体实战：CODER五层工程化框架

AI编程智能体正在改变软件开发的方式。但要让AI编程智能体真正在企业中发挥作用，需要的不仅是强大的AI模型，更是一套系统化的工程管理框架。CODER框架从上下文供给、编排控制、开发执行、评测回归、审查反馈五个层面，为企业级AI编程智能体的落地提供了完整的解决方案。记住：AI编程智能体的目标不是替代开发者，而是让开发者从重复性的编码工作中解放出来，专注于更有价值的创造性工作。掌握CODER框架，你就

 少林码僧
2026-07-26 08:47:32

 220

 2

#前端 #javascript #html +2
GitHub开源项目深度评测：html-anything —— 智能体时代的 HTML 编辑器

**html-anything** 是由 nexu-io 团队开发的一款创新型 HTML 编辑器，专为智能体时代设计。它允许用户通过 AI 助手（Claude Code、Cursor、Gemini、Copilot 等）直接生成专业级 HTML 内容，支持杂志排版、演示文稿、海报、社交媒体卡片、原型设计、数据报告等 9 种输出形式，内置 75 项专业技能模板。

TunerT_TQ
2026-07-21 21:03:01

 398

 6

#github #开源 #html +2
Cursor生成HTML后如何快速转入Figma二次开发

【AI生成HTML秒转Figma设计稿】WebtoDesign插件实现一键转换：通过Chrome插件导出AI生成的HTML为.w2d文件，再经Figma插件导入即可获得完整可编辑的设计稿，保留原始布局、文字和图片。该方案特别适合需要精修AI产出网页的设计场景，将原本1-2小时的手动重建工作缩短至1分钟内完成，支持Claude/Cursor等工具生成的页面快速交付或二次设计。双插件组合现已上架Chr

weixin_54106324
2026-07-21 15:30:20

 553

 14

#html #figma #前端
cursor: pointer；

是css的一个属性，用于设置鼠标指针在元素上的样式为手型。

great_sz
2023-06-07 22:38:28

 8170

#html
CSS学习笔记（七）CSS图标，CSS 链接，cursor，CSS 列表，CSS 表格

CSS图标如何添加图标向 HTML 页面添加图标的最简单方法是使用图标库，比如 Font Awesome。将指定的图标类的名称添加到任何行内 HTML 元素（如 <i> 或 <span>）。下面的图标库中的所有图标都是可缩放矢量，可以使用 CSS进行自定义（大小、颜色、阴影等）。Font Awesome 图标如需使用 Font Awesome 图标，请访问 fontawes

〔晴【天】º〕
2021-05-16 16:25:41

 5716

 6

#html #css
【ngrok】ngrok的基本使用和返回错误html页面的解决方法

前端：使用vue作为框架后端：flask框架，Ubuntu系统目标：当前我的后端服务器在本地计算机上，前端通过axios向后端交互也是通过get或post向本地的url：http：//192.168.20.199：4999/login发送请求，我希望即使前端在云服务器上，也能向后端的url发送请求。

叫我诺贝尔
2024-07-02 21:00:06

 3184

 15

#html #前端 #后端
基本功能使用ngrok内网映射外网

下载ngrok,解压,DOS命令运行到该文件目录，例如C盘ngrok文件夹：运行C:和CD ngrok接着运行ngrok -config ngrok.cfg -subdomain xie 8080xie 自定义的域名, 8080 为需要映射到的本机端口使用http://huangxie.ngrok.natapp.cn/+项目名称访问本地项目国内提供域

 baiyouyunxu
2016-01-28 09:30:52

 456

#html
cursor设置为自定义图片

这里的url可以是常用图片格式，可以是base64图片。总结：图片不要过大，最好是32*32的图片，如果过大，则直接忽略你的图片。

韭伍後
2022-12-14 12:51:49

 2553

#前端 #html
HTML和CSS第一天--cursor follow mouse movement

HTML和CSS第一天--cursor follow mouse movement文件介绍新加成员CDNJquery代码区HTMLcss文件介绍![Alt](https://yt3.ggpht.com/a/AGF-l7_JOPbXWp3QXZDuk7CCOzxdwpRg8MFJliMx5A=s900-c-k-c0xffffffff-no-rj-mo0）这个学习资源来自于一个youtuber...

有态度的我
2020-01-09 22:00:52

 399

#css #html #html5 +2
cursor、通义灵码和豆包生成圣诞树html网页代码

下面这张图是发这篇文章的初始原因，偶然间看到这个CSDN的热点任务，想要用AI辅助工具对比生成一份html文件，本篇文章只对比，没有结论，下面我把测试过程发出来。圣诞树html网页代码演示效果圣诞树html网页代码演示效果可以看到右侧有一个闪动的效果。圣诞树html网页代码演示效果上面的树有一个旋转的效果。仁者见仁，智者见智吧！

京河小蚁
2024-12-26 09:57:27

 1724

 16

#html
【CSS 06】图标 icons 链接 link 光标 cursor

【CSS 06】图标 icons 链接 link 光标 cursor向 HTML 页面添加图标的最简单方法是使用图标库，比如 Font Awesome通过CSS可以用不同的方式设置链接的样式。

Zanebla
2023-06-07 14:08:20

 1123

 1

#css #html #css3
使用 JavaScript、HTML 和 CSS 使用 Ollama 的 Llama 3 模型构建聊天应用程序

在这篇博文中，我们将介绍如何创建一个与 Ollama 的 Llama 3 模型交互的简单聊天应用程序。最后，您将拥有一个有效的聊天应用程序，该应用程序将用户消息发送到 AI 模型并实时显示响应。通过执行这些步骤，您已经创建了一个聊天应用程序，该应用程序将用户消息发送到 Ollama 的 Llama 3 模型并显示响应。在此设置中，您的Node.js服务器将处理传入的请求，与 Ollama 的 Ll

乌南竹
2024-07-19 15:00:00

 840

 1

#javascript #html #css
Failed to move cursor on screen HDMI1

Failed to move cursor on screen HDMI1 升成/root/kms.conf。出现这个错误，鼠标，健盘报错。

m0_63048098
2023-01-07 10:50:20

 1630

 2

#java #html #前端
cursor（鼠标手型）属性

㈠简单介绍在浏览网页时，通常看到的鼠标光标形状有箭头、手形、沙漏等，而在 windows 中实际看到的鼠标指针种类比这个还要多。一般情况下，鼠标光标的形状由浏览器负责控制，大多数情况的光标形状为箭头形状，当指向链接时，光标形状会变成手指形状。cursor 属性规定要显示的光标的类型（形状）。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状。㈡属性值㈢属性简单讲解cursor属性的默认值为

 小海fighting呀！
2022-12-06 12:00:09

 1.1w

 19

#css #前端 #html