HTML5基础——文字常用标签(下)

一、微文概览

  1. 粗体、斜体、下划线、删除线
  2. 上标与下标

二、详细介绍

  • 1. 粗体、斜体、下划线、删除线

我们在浏览网页的时候,经常会看到一些特殊效果的文字,比如粗体、斜体、下划线、删除线等,下面我将给大家介绍这些效果。

1.1 粗体

语法:

<strong>粗体字</strong>

案例代码:

<html>
    <head>
        <title>文字的粗体</title>
    </head>
    <body>
        <strong>粗体字</strong>
    </body>
</html>

运行效果:


粗体字.png

1.2 斜体

语法:

<em>斜体字</em>

案例代码:

<html>
    <head>
        <title>文字的斜体</title>
    </head>
    <body>
        <em>斜体字</em>
    </body>
</html>

运行效果:


斜体.png

1.3 下划线

语法:

<u>下划线</u>

案例代码:

<html>
    <head>
        <title>文字的下划线</title>
    </head>
    <body>
        <u>下划线</u>
    </body>
</html>

运行效果:


下划线.png

1.4 删除线

语法:

<strike>删除线</strike>或<s>删除线</s>

案例代码:

<html>
    <head>
        <title>文字的删除线</title>
    </head>
    <body>
        <strike>文字的删除线</strike><br/>
        <s>文字的删除线</s>
    </body>
</html>

运行效果:


删除线.png
  • 2. 上标与下标

我们在浏览网页时,有时会看到数字的平方m²,m³,还有在上化学课时,经常会用到下标,比如CO2,其中2在O的下方,那么这种效果的文字该如何表示呢?
语法:

<sup>上标</sup>
<sub>下标</sub>

案例代码:

<html>
    <head>
        <title>文字的上下标</title>
    </head>
    <body>
        m<sup>2</sup><br/>
        CO<sub>2</sub>
    </body>
</html>

运行效果:


文字的上标与下标.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 标签用于表示一段内容的着重点 用于表示一个内容的重要性、 通常em显示为斜体,而strong显示为粗体 标签会使文...
    changzj阅读 7,320评论 0 0
  • 一、微文概览 标题字体与字号颜色 二、详细介绍 1. 标题 我们在HTML文件中写一篇文字时,总会希望将标题的文字...
    微学派阅读 2,382评论 7 49
  • 字体属性:(font) 大小:font-size: x-large;(特大) xx-small;(极小) 一般中文...
    wlki阅读 295评论 0 0
  • 本章导航: 1. 介绍 markdown 的基础知识与如何编写 。 2. 转换字体。 导言 Markdown 的设...
    水之心阅读 2,825评论 0 16
  • 一、基本元素 标题 列表:有序列表、无序列表,嵌套列表 引用引用文本嵌套引用文本行内代码多行代码 字体和效果强调:...
    每水阅读 400评论 0 2