美文网首页web进阶
web进阶之六:文本标签及文本样式

web进阶之六:文本标签及文本样式

作者: 甚得朕心 | 来源:发表于2018-09-09 23:01 被阅读11次

文本标签

  • em标签用于表示一段内容中的着重点,语气上的强调。
  • strong标签用于表示一个内容的重要性。
    这两个标签可以单独使用,也可以一起使用。
  • small标签表示细则一类的旁注,通常包括 免责声明、注意事项、法律限制、版权信 息等。
    浏览器在显示small标签时会显示一个比父 元素小的字号。
  • i标签会使文字变成斜体。icon图标
  • b标签会使文字变成粗体。在目前一般都不会用。

这两个标签和em和strong类似,但是这两个标签没有语义。
所以根据html5标准,当我们只想设置文本 特殊显示,而不需要强调内容时就可以使 用i和b标签。

  • 使用cite标签可以指明对某内容的引用或参 考。例如,戏剧、文章或图书的标题,歌 曲、电影、照片或雕塑的名称等。
  • blockquote和q表示标记引用的文本。
     1. blockquote用于长引用
     2. q用于短引用。
    在两个标签中还可以使用cite属性来表示引用的地址。
  • sup和sub用于定义上标和下标。
     上标主要用于表示类似于10的三次方中的3。
     下标则用于表示类似余H2O(水分子)中的2。
    上标页通常在网页中用来注释和引用。
  • ins表示插入的内容,显示时通常会加上下 划线。
     del表示删除的内容,显示时通常会加上删 除线。
  • 如果你的内容包含代码示例或文件名,就 可以使用code元素。
     pre元素表示的是预格式化文本,可以使用
     pre包住code来表示一段代码。默认会使用等宽的字体
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文本标签和文本样式</title>
</head>
<body>
    <p>
         <!--em是语气强调,strong是强调整个内容-->
        <strong>警告:任何情况下不要接近僵尸。</strong>
        他们只是 <em>看起来</em> 很友好,实际上他们是为了吃你的胳膊!<br>
          <small>僵尸的秘密</small>
          <!--small标签,会比父类小一个字号-->
    </p>
        <p>
        <i>我是i标签中的内容</i><br>
        <b>我是b标签中的内容</b><br>
    </p>
        <p>
        <small>&copy;甚得朕心保留解释权利.</small><br>
    </p>
    <p>
        <!--<city>表示某内容的引用或参考-->
    <cite>《七龙珠》</cite>讲的是召唤神龙的故事。
    </p>
     <p>
        <!--短引用,浏览器会自动添加一个引号
            不过不一定所有的浏览器都添加
        -->
        孔子曾经说过:<q>学而时习之不亦说乎</q>
    </p>
    <p>
        <!--长引用,这样效果会独占一行-->
        孔子曰:<blockquote>天将降大任于斯人也</blockquote>
    </p>
        <p>
              <!--网页中一般在人名上面有个什么符号,一点击就会跳转一个链接。-->
        韩磊<sup><a href='https://baike.baidu.com/item/%E9%9F%A9%E7%A3%8A/32383?fr=aladdin'>[1]</a><sup>
    </p>
        <p>H<sub>2</sub>O</p>
        <p>
        <!--就像购物网站上看到的一样,原来的价格划了,出现一个惊爆价-->
        <del>17.75</del><br>
        15.54<br>
    </p>
    <!-- ins表示一个插入的内容,会自动添加下划线 -->
    <p>
        那个高楼真<ins>高啊</ins>!
    </p>
        <pre>
        <code>
if a>b:
    print("hello")
        </code>
    </pre>
</body>
</html>。

本文样式由于太多比较杂乱,我就全部放在一个代码块中了,看起来也方便,代码直接复制下来,一运行就能看到效果。


有任何问题请给我留言,或者直接发我邮箱taijirenlijunyang163@.com。欢迎大家交流讨论。

相关文章

  • web进阶之六:文本标签及文本样式

    文本标签 em标签用于表示一段内容中的着重点,语气上的强调。 strong标签用于表示一个内容的重要性。这两个标签...

  • web文本标签及文本样式

    文本标签 为标识网页中的不同内容而生 标签 em标签用于表示一段内容中的着重点stron...

  • 文本标签及文本样式

    一.文本标签 1. 和 -- em标签用于表示一段内容中的着重点。strong标签--- strong标签用于表...

  • 文本标签及文本样式

    一、文本标签 em标签用于表示一段内容中的着重点。strong标签用于表示一个内容的重...

  • 文本标签及文本样式

    文本标签 和 em标签用于表示一段内容中的着重点。strong标签用于表示一个内容的重要性。这两个标签可以单独使用...

  • 文本标签及文本样式

    文本标签 表示内容中的着重点 表示内容的重要性这个两个标签可以单独使用也可以一起使用;通常 显示为斜体, 显示为粗...

  • 文本标签 及文本样式

    和 em标签用于表示一段内容中的着重点。 strong标签用于表示一个内容的重要性。这两个标签可以单独使用,也可以...

  • 文本标签及文本样式

    1.文本标签 和 em标签用于表示一段内容中的着重点。 strong标签用于表示一个内容的重要性。 这两个标签可以...

  • WEB基础入门三:文本标签及文本样式

    一、文本标签 1、em标签用于表示一段内容中的着重点,通常显示为斜体;2、strong标签用于表示一个内容的重要性...

  • 十二:文本标签及文本样式

    1. 和 标签 em 标签用于表示一段内容中的着重点strong标签用于表示一个内容的重要性这两个标签可以单独使用...

网友评论

    本文标题:web进阶之六:文本标签及文本样式

    本文链接:https://www.haomeiwen.com/subject/spodgftx.html