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 标签
相关推荐
学嵌入式的小杨同学8 小时前
从零打造 Linux 终端 MP3 播放器!用 C 语言实现音乐自由
linux·c语言·开发语言·前端·vscode·ci/cd·vim
weixin_425543739 小时前
TRAE CN3.3.25 构建的Electron简易DEMO应用
前端·typescript·electron·vite·nestjs
Mr Xu_10 小时前
【Vue3 + ECharts 实战】正确使用 showLoading、resize 与 dispose 避免内存泄漏
前端·信息可视化·vue·echarts
0思必得010 小时前
[Web自动化] Selenium设置相关执行文件路径
前端·爬虫·python·selenium·自动化
雯0609~10 小时前
hiprint:实现项目部署与打印1-官网提供普通html版本
前端·html
不绝19110 小时前
UGUI——进阶篇
前端
Exquisite.11 小时前
企业高性能web服务器(4)
运维·服务器·前端·网络·mysql
2501_9445255411 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter
2601_9498574311 小时前
Flutter for OpenHarmony Web开发助手App实战:快捷键参考
前端·flutter
wangdaoyin201012 小时前
若依vue2前后端分离集成flowable
开发语言·前端·javascript