HTML文本格式化，元素标签表，实例在线编辑器

什么是HTML文本格式化

HTML文本格式化，就像word软件当中的“字体”属性类似，可以为HTML定义格式化的渲染，比如字体加粗、倾斜、大号、小号、上下标等。

HTML的格式化也是采用标签的形式，包含在开始标签和闭合标签之内，比如<b></b>可以用来加粗文本。

文本格式化标签表

标签	描述
<b>	定义粗体
<big>	大号字体
<small>	小号字体
<em>	着重字体
<i>	斜体
<strong>	加重语气，与粗体有些相似
<sup>	上标，比如x²
<sub>	下标，如x₁
<ins>	定义插入字，应该是insert的缩写；
<del>	定义删除文本

文本格式化实例

提示：点击“试一试”，再点击在线编辑器的运行，可查看HTML个文本格式化的渲染效果：

<html>
<body>
  <p><b>粗体！</b></p>
  <p><big>大号字体！</big></p>
  <p><samll>小号字体！</samll></p>
  <p><em>着重字体！</em></p>
  <p><i>斜体！</i></p>
  <p><strong>加重语气！看看是不是跟粗体十分相似</strong></p>
  <p>这是上标，如x<sup>2</sup></p>
  <p>这是下标，如x<sub>1</sub>y<sub>1</sub>z<sub>1</sub>.com</p>
  <p>这是<ins>插入</ins>字体</p>
  <p>这是<del>删除的格式</del></p>
</body>
</html>

计算机输出标签

计算机输出标签，一般用来显示静态页面的源代码，比如很多自媒体平台的工具栏当中有一个插入“代码块”的按钮，大概就是用这个来开发的吧。再比如，本站的实例代码的显示，也大都通过<code>标签来实现。

标签	描述
<code>	计算机代码
<kbd>	键盘码，或按键码keycode
<samp>	计算机代码样本
<tt>	显示类似打字机或等宽的文本
<var>	定义变量
<pre>	定义预格式化的文本，会保留空格和换行符，如上面实例代码便是包围在该标签内

计算机输出标签实例代码

<html>
<body>
  <code>def python():
  x = "这是定义python的函数"</code>
  <pre><code>def _python():
  y = "与上面的的函数不同，这里外加了pre的标签，将保留空格和换行！"</code></pre>
  <kbd>按键码，如F5是116</kbd><br>
  <samp>定义计算机代码样本</samp><br>
  <var>定义HTML变量</var><br>
  <tt>定义等宽的字体</tt>
</body>
</html>

引用和术语格式化标签

引用，就像小时候写作文引用名言一样，术语，比如文章中出现专业术语时可以用术语专用的标签进行格式化，以突出显示：

标签	描述
<q>	常用于短的引用
<blockquote>	常用于较长的引用
<cite>	用于引证
<address>	顾名思义，用来定义地址
<bdo>	文字方向，与标签的dir属性一同使用，比如dir='rtl'，表示从右到左
<abbr>	定义缩写
<acronym>	定义首字母缩写
<dfn>	定义术语或短语的定义

 <html>
<body>
  <q>大器晚成</q>
  <blockquote>这是较长的引用！</blockquote>
  <abbr title="Master of Business Administration">MBA</abbr><br>
  <acronym title="Master of Business Administration">MBA</acronym><br>
  <cite>这是引证，在支持的浏览器里头，鼠标移动到缩写的上方时，会显示出缩写的完整内容，即title中的内容。</cite>
  <address>这是地址标签</address>
  <bdo dir='rtl'>文字方向</bdo><br><br>
  <dfn>dfn标签用来定义引用的定义，如上面的address标签通常表现为斜体，当是这里却并不是，可能跟浏览器有关！blockquote标签有些地方渲染的时候并没有左边框，而这里有！不知道您的浏览器的渲染效果如何！</dfn>
</body>
</html>

hot：热门