HTML 文本格式化基础

HTML 文本格式化基础

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

加粗文本 使用 <b><strong> 标签实现加粗效果。<strong> 还具有语义化作用,表示重要内容。

html 复制代码
<b>加粗文本</b>
<strong>重要文本</strong>

斜体文本 使用 <i><em> 标签实现斜体效果。<em> 表示强调内容。

html 复制代码
<i>斜体文本</i>
<em>强调文本</em>

高级文本格式化

删除线和下划线 使用 <del> 表示删除内容,<ins> 表示插入内容。<u> 可用于纯视觉下划线但不推荐。

html 复制代码
<del>删除文本</del>
<ins>插入文本</ins>

上标和下标 <sup><sub> 分别用于数学公式或化学式。

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

预格式化文本与代码

<pre> 保留空白字符和换行,适合显示代码或诗歌。<code> 标记代码片段。

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

引用与署名

<blockquote> 定义长引用,<q> 用于短引用。<cite> 标记作品标题。

html 复制代码
<blockquote>长引用内容</blockquote>
<q>短引用</q>
<cite>《作品标题》</cite>

其他格式化标签

<mark> 高亮文本,<small> 缩小字体,<abbr> 标记缩写词。

html 复制代码
<mark>高亮内容</mark>
<small>小号文本</small>
<abbr title="World Health Organization">WHO</abbr>

注意事项

  • 避免滥用 <u> 标签,可能与链接样式混淆
  • 优先使用语义化标签(如 <strong> 而非 <b>
  • 复杂样式建议结合CSS实现
  • 嵌套标签时注意闭合顺序
相关推荐
JavaGuide1 天前
终于有好用的 Claude Code 状态栏增强插件了!
前端·后端·ai编程
丷丩1 天前
MapLibre GL JS第12课:检查WebGL支持
前端·javascript·map·webgl·mapbox·maplibre gl js
巴巴博一1 天前
【AI 赋能前端】告别手写样式!ui-ux-pro-max-skill 插件完整使用指南(附高阶 Prompt 模板)
前端·css·人工智能·ui
shibushi1141 天前
mediawiki安装
前端
KaMeidebaby1 天前
卡梅德生物技术快报|斑点杂交 + 膜芯片:6 种水果源性成分检测技术实操拆解
前端·人工智能·物联网·其他·百度·新浪微博
我有满天星辰1 天前
【那些年踩过的坑-前端篇- Mac版本】Mac 从零搭建 Node 环境:nvm + Node + Vue 实战(避坑终极版)
前端·vue.js·macos
Beginner x_u1 天前
前端八股整理(手写 03)|防抖节流、深拷贝、函数柯里化
前端·深拷贝·防抖节流·手撕·函数柯里化
仰望.1 天前
vxe-table 导出 Excel 进阶教程:自定义样式与高级功能
前端·javascript·vue.js·excel·vxe-table·vxe-ui
我叫张土豆1 天前
从 0 到 1 搭一个可用的 Vue Flow 工作流编排器(含下载/加载/自动布局)
前端·javascript·vue.js
止水编程 water_proof1 天前
Spring Web MVC 入门
前端·spring·mvc