CSS 通过 link 标签关联 HTML，须置于 head 中且路径正确；优先级：内联 style > style 标签 > link 外部样式；class/id 名称须严格匹配；文件编码须为 UTF-8 无 BOM。
CSS 不是“应用到 HTML”而是“关联到 HTML”，关键在链接方式和加载顺序
link 标签必须写在 head 里，且 href 路径要对
浏览器解析 HTML 是从上到下，<link> 放在 里会导致样式延迟生效，甚至触发重排。路径错误（比如少个 ./ 或拼错文件名）会让 CSS 根本不加载，控制台出现 404 错误信息：Failed to load resource: the server responded with a status of 404 ()。
- 推荐写法：
<link rel="stylesheet" href="style.css">（同目录）或<link rel="stylesheet" href="./css/style.css"> - 绝对路径慎用：
href="/css/style.css"依赖服务器根目录结构，本地双击打开 HTML 会失效 - 检查浏览器开发者工具的 Network 标签页，看
style.css状态码是不是 200
内联 style 和 style 标签优先级高于 link 引入的 CSS
同一个元素上，style="color: red" 会覆盖外部 CSS 文件里写的 color: blue；<style></style> 标签里的规则也比 <link> 加载的规则优先级高。这不是 bug，是 CSS 层叠规则（specificity + source order）决定的。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 调试时如果样式没生效，先右键检查元素，看开发者工具里哪些规则被划掉（strikethrough），被划掉的就是被更高优先级覆盖了
- 避免滥用
!important，它会让后续维护变困难，尤其是多人协作时 -
<style></style>标签适合页面独有样式，通用样式务必走外部.css文件
HTML 中 class 和 id 名称要和 CSS 选择器完全一致
大小写、空格、连字符都敏感。写成 class="my-button"，但 CSS 里写成 .my_button 就不匹配；id="header" 对应的是 #header，不是 .header。
立即学习“前端免费学习笔记（深入）”；
- HTML 中 class 可以多个，用空格分隔：
class="btn btn-primary active"，CSS 里就得写.btn.active或分别定义 - id 在整个页面必须唯一，重复会导致 JS 获取元素出错，也影响可访问性
- 中文或特殊符号命名（如
class="按钮"）虽语法合法，但易出编码问题，一律用英文加连字符
最常被忽略的一点：CSS 文件编码要是 UTF-8 无 BOM，否则中文注释或字体名可能乱码，某些旧版 IE 直接不加载整个文件。
