文本格式化 - 知蛛网

基本文本格式化标签

视觉样式标签

<!-- 加粗 -->
<p>这是<b>加粗文本</b>，这是<strong>重要文本</strong></p>

<!-- 斜体 -->
<p>这是<i>斜体文本</i>，这是<em>强调文本</em></p>

<!-- 下划线 -->
<p>这是<u>带下划线的文本</u></p>

<!-- 删除线 -->
<p>原价：<s>¥999</s> 现价：¥599</p>
<p>任务：<del>旧任务</del> <ins>新任务</ins></p>

<!-- 上标和下标 -->
<p>水的化学式：H<sub>2</sub>O</p>
<p>数学公式：x<sup>2</sup> + y<sup>2</sup> = z<sup>2</sup></p>

<!-- 高亮 -->
<p>请特别注意：<mark>这个部分很重要</mark></p>

<!-- 小号文本 -->
<p>版权信息：<small>© 2024 公司名称 保留所有权利</small></p>

计算机相关文本标签

<!-- 代码 -->
<p>使用 <code>console.log()</code> 输出信息</p>

<!-- 键盘输入 -->
<p>按 <kbd>Ctrl + S</kbd> 保存文件</p>

<!-- 程序输出 -->
<p>程序输出：<samp>文件保存成功</samp></p>

<!-- 变量 -->
<p>设置变量：<var>username</var> = "张三"</p>

<!-- 预格式化文本 -->
<pre>
function hello() {
    console.log("Hello World!");
    return true;
}
</pre>

引用和定义标签

<!-- 短引用 -->
<p>孔子说：<q>学而时习之，不亦说乎。</q></p>

<!-- 块引用 -->
<blockquote cite="https://example.com">
    <p>这是来自其他来源的长篇引用内容，会单独显示为一个区块。</p>
    <footer>— 作者姓名, <cite>作品名称</cite></footer>
</blockquote>

<!-- 术语定义 -->
<p><dfn>HTML</dfn> 是超文本标记语言。</p>

<!-- 缩写 -->
<p>使用 <abbr title="HyperText Markup Language">HTML</abbr> 构建网页。</p>

<!-- 地址 -->
<address>
    作者：张三<br>
    邮箱：<a href="mailto:zhangsan@example.com">zhangsan@example.com</a>
</address>

文字方向标签

<!-- 从左到右 -->
<p>英文：<bdo dir="ltr">Hello World</bdo></p>

<!-- 从右到左 -->
<p>阿拉伯文：<bdo dir="rtl">مرحبا بالعالم</bdo></p>

<!-- 双向重写 -->
<p>混合文本：<bdi>Hello World</bdi> <bdi>مرحبا</bdi></p>

用HTML表达含义和结构，用CSS控制外观和样式！