cite标签默认斜体是HTML规范要求，体现作品标题语义；取消斜体应仅用cite{font-style:normal}覆盖，不可替换标签以免丢失无障碍支持与结构信息。

为什么 cite 标签里的书名总是斜体？

因为 HTML 规范明确要求 cite 元素默认以斜体渲染——这不是浏览器“随便加的”，而是语义化的一部分：cite 表示作品标题（如《三体》《百年孤独》），斜体是其视觉约定。即使你没写任何 CSS，<cite>三体</cite> 在所有现代浏览器里都会显示为斜体。

想取消 cite 的斜体，只改这一个标签

最直接、最安全的做法是用 CSS 精确覆盖它，不牵连其他元素：

• 在样式表或 <style></style> 块中写：cite { font-style: normal; }
• 如果项目用了 CSS 框架（比如 Bootstrap），记得把它放在框架样式之后，否则可能被覆盖
• 避免用 !important ——除非调试时临时验证，否则会增加后续维护成本

别误删语义：取消斜体 ≠ 换掉 cite 标签

cite 的价值不在斜体，而在告诉浏览器、搜索引擎和读屏软件“这是作品标题”。换成 <span></span> 或 <b></b> 虽然也能出效果，但丢失了结构信息。尤其对无障碍访问场景，屏幕阅读器可能跳过或错误朗读非语义标签。

常见误区包括：

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

• 把 <cite>《活着》</cite> 改成 <span class="book-title">《活着》</span> 后忘了加 ARIA 属性（如 role="doc-biblioentry"）
• 全局重置 i, em, cite { font-style: normal; }，结果意外干掉了需要强调的 em 和术语类 i
• 以为删掉 cite 标签就能“彻底解决”，其实只是掩盖了语义缺失问题

兼容性和字体细节容易被忽略

即使写了 cite { font-style: normal; }，某些情况下文字仍可能“看起来像斜体”：

• 父容器设置了 font-style: italic，子元素会继承——必须显式在 cite 上覆盖
• 所用字体本身不提供 normal 字形（极少见），浏览器可能 fallback 到合成倾斜（oblique），此时需检查 @font-face 是否声明了 font-style: normal 对应的文件
• 部分旧版 IE（IE9 及以下）对 cite 的默认样式支持不稳定，但 2026 年基本可忽略

真正关键的不是“怎么让它不斜”，而是“斜体消失后，书名是否还被正确识别为书名”。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！