HTML 文本格式化

HTML 文本格式化基础

HTML 提供了多种标签用于文本格式化,包括加粗、斜体、下划线等常见样式。这些标签可以单独使用或嵌套组合,以实现更复杂的文本效果。

加粗文本 使用 <b><strong> 标签:

html 复制代码
<b>加粗文本</b>
<strong>强调文本(语义更强)</strong>

斜体文本 使用 <i><em> 标签:

html 复制代码
<i>斜体文本</i>
<em>强调斜体(语义更强)</em>

高级文本格式化

下划线与删除线

html 复制代码
<u>下划线文本</u>
<s>删除线文本</s>
<del>被删除的文本(语义更强)</del>

上标与下标

html 复制代码
E = mc<sup>2</sup>
H<sub>2</sub>O

代码与预格式化文本

html 复制代码
<code>console.log("Hello");
复制代码
保留空格和换行的多行文本

组合使用示例

html 复制代码
<p>
  <strong>重要通知</strong>: 请于<em>周五前</em>提交报告。<br>
  原价: <s>$100</s> 现价: $80<br>
  化学公式: CO<sub>2</sub> + H<sub>2</sub>O → H<sub>2</sub>CO<sub>3</sub>
</p>

注意事项

  • 语义化标签(如 <strong><em>)不仅影响外观,还传达内容重要性
  • 避免过度使用下划线,可能与链接样式混淆
  • CSS 可以实现更精细的样式控制,但基础格式化优先使用 HTML 标签
相关推荐
炫饭第一名2 小时前
速通Canvas指北🦮——基础入门篇
前端·javascript·程序员
王晓枫3 小时前
flutter接入三方库运行报错:Error running pod install
前端·flutter
符方昊3 小时前
React 19 对比 React 16 新特性解析
前端·react.js
ssshooter3 小时前
又被 Safari 差异坑了:textContent 拿到的值居然没换行?
前端
曲折3 小时前
Cesium-气象要素PNG色斑图叠加
前端·cesium
Forever7_3 小时前
Electron 淘汰!新的桌面端框架 更强大、更轻量化
前端·vue.js
Angelial3 小时前
Vue3 嵌套路由 KeepAlive:动态缓存与反向配置方案
前端·vue.js
jiayu4 小时前
Angular学习笔记24:Angular 响应式表单 FormArray 与 FormGroup 相互嵌套
前端
jiayu4 小时前
Angular6学习笔记13:HTTP(3)
前端
小码哥_常4 小时前
Kotlin抽象类与接口:相爱相杀的编程“CP”
前端