<style>标签在Markdown中通常失效，因GitHub、Typora默认模式、VS Code预览等解析器主动过滤该“危险标签”；可靠方案是用class配合外部CSS注入。
Markdown 本身不支持直接写 <style> 标签生效——绝大多数解析器（如 GitHub、Typora 默认模式、VS Code 预览插件）会过滤或忽略内联 <style>，哪怕你写了也看不到效果。
为什么 <style> 在 Markdown 预览里经常失效
Markdown 解析器（如 marked、remark、CommonMark 实现）默认只处理有限 HTML 子集，<style> 属于“危险标签”，多数会直接剥离。GitHub Flavored Markdown 明确不渲染 <style>；Typora 需手动开启「允许 HTML」且仅在编辑态部分生效；VS Code 的官方预览根本不执行任何 CSS。
- 不是语法写错了，是解析器主动丢弃
- 即使渲染出来，CSS 作用域也常被预览容器的 shadow DOM 或 iframe 隔离
-
<style>放在文档开头/结尾都无效，位置不改变结果
哪些场景下 <style> 可能“看起来”生效
仅限于：你用的是支持完整 HTML 渲染的定制环境，比如自己写的 Electron 应用、用 marked 配置了 sanitize: false + smartLists: true 的网页，或 Typora 开启了「文件 → 选项 → 外观 → 启用 HTML」并配合自定义主题 CSS。
pdf文档转markdown
下载
将PDF文件（含扫描件、图片）转换为Markdown格式。接入MinerU和PaddleOCR双引擎，支持扫描件OCR识别、公式表格解析、多语言识别。兼容本地OCR识别。
- Typora 中启用 HTML 后，
<style>.red { color: red; }</style>+<p class="red">test</p>才可能显示红色 - VS Code 需安装插件如
Markdown Preview Enhanced，它用本地服务渲染，才支持内联<style> - Obsidian 通过社区插件
Custom CSS管理样式，但也不走内联<style>路径
真正可靠的替代方案：用 class + 外部 CSS 注入
与其赌解析器是否放行 <style>，不如把样式逻辑交给宿主环境控制。核心思路是：Markdown 写 class，外部注入 CSS 规则。
立即学习“前端免费学习笔记（深入）”；
- 在 Markdown 里写：
<div class="highlight-box">注意这里</div> - 在 Typora 中：设置 → 外观 → 打开样式文件夹 → 编辑
base.user.css，加入.highlight-box { background: #fffbcc; padding: 8px; border-left: 4px solid #f9a825; } - 在 Obsidian 中：设置 → 外观 → CSS 代码片段 → 新建
custom-highlight.css，粘贴同上规则 - 在网页项目中：用
marked渲染后，把 CSS 通过<link>或document.styleSheets注入到渲染容器的父级
内联 <style> 是个幻觉式方案——它只在极少数调试场景下“偶然”起效，一旦换环境或升级解析器版本就断掉。真要稳定控制样式，必须把 class 当契约，把 CSS 放到解析器无法绕过的加载链路里。
