Ceryn

HTML 学习笔记风格提示词

6分钟阅读

活跃分钟 0访问量 0点赞量 0点击量 0

请你按照我已有的 HTML 学习笔记风格，帮我整理新的 HTML 知识点笔记，并写成适合直接放入 Obsidian 的 Markdown 内容。

笔记整体风格

  • 使用简洁、直接、偏学习记录式的中文表达。
  • 不要写得太像教材，要像个人学习笔记。
  • 先给出概念，再给出常见语法或代码示例，最后补充特点、注意事项或理解。
  • 重点内容可以使用 加粗。
  • HTML 标签、属性、代码关键词使用反引号包裹，例如：<div>、href、src。
  • 适合初学者理解，不要堆太多复杂概念。
  • 可以适当补充用途、场景、注意事项和常见错误。
  • 不需要生成 YAML frontmatter，文件属性会由 Obsidian 自动生成。
  • 完成整理后，应根据正文内容总结 tags。
  • tags 的语义不能和文档所在目录重复。
  • 完成整理后，这篇文章属于 AI 写作，应在 author-type 改为 ai。
  • 完成整理后，应在 status 列表中添加 Completed。
  • status 只允许使用：Backlog、Planned、Ready、In Progress、Blocked、In Review、Completed。
  • note-sections 只允许使用 introduction、outline、main-body、lead-out key-highlight，如果笔记已经包含这些内容，就可以全部写入。
  • tag、status、note-sections 这些都是 yaml 列表数组，请采用多行数组格式

标题结构

正文优先使用以下层级：

引入

用一两句话说明这个知识点为什么存在、解决什么问题。

正文

正式解释概念和用法。

可以根据内容拆分为：

定义

使用引用块或 callout 说明核心定义，例如：

定义

这里写概念定义。

或者普通引用：

这里写简短定义。

语法

给出最常见的基础写法。

<element attribute="value"></element>

例子

用具体小例子说明。

示例标题

说明这个例子在做什么。

<!-- 示例代码 -->

特点

用无序列表总结规则、特征或注意事项。

  • HTML 元素通常由开始标签和结束标签组成
  • 某些元素是空元素
  • 属性一般写在开始标签中
  • 标签名和属性名建议使用小写

理解

用更口语化的方式总结这个知识点的本质理解。

例如：

可以把它理解为……

它的作用不是……而是……

在网页结构中，它更像是……

引出

如果这个知识点会连接到下一个知识点，可以简单写一句。

例如：

理解了这个之后，就可以继续学习 HTML 表单中的输入控件。

后续可以结合 CSS 和 JavaScript 控制它的样式与行为。

代码风格

  • HTML 代码块使用 html 语言标记。
  • 代码示例要尽量短，能说明问题即可。
  • 代码中可以加入简短注释，但不要过多。
  • 如果是完整模板类内容，可以给出较长代码，并在代码注释中解释作用。
  • 示例优先使用真实常见场景，例如链接、图片、表单、文本、列表、表格等。

内容组织习惯

请优先按照这个顺序写：

  1. 这个东西是什么
  2. 为什么需要它
  3. 基础语法是什么
  4. 常见用法有哪些
  5. 代码例子
  6. 注意事项
  7. 我的理解式总结

表达习惯

  • 解释 href 时，可以写成：“用于将文本附上链接”。
  • 解释 src、alt 时，可以写成：“分别用于指定图像的来源和提供图像的替代描述文本”。
  • 解释禁用、默认选中等属性时，要说明它在页面中的实际效果。
  • 遇到安全、SEO、无障碍相关内容，要用简单话说明它的价值。

链接和资料

如果有权威参考资料，可以放在靠前位置，例如：

网站

HTML 标签参考手册

或直接在正文中插入相关链接。

输出要求

  • 只输出完整 Markdown 笔记内容。
  • 不要额外解释“我将如何写”。
  • 不要使用过度复杂的术语。
  • 内容要能直接复制进 Obsidian。
  • 如果我给出笔记标题，例如 HTML 列表，就按这个主题生成完整笔记。

使用方式

之后可以这样提问：

请按照我的 HTML 学习笔记风格，整理一篇 [[HTML 列表]]

或者：

按照 HTML 学习笔记风格，帮我写入 [[HTML 表格]]

关系图谱