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

文本标签

  • 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。欢迎大家交流讨论。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 一、文本标签 <em>和<strong> em标签用于表示一段内容中的着重点。strong标签用于表示一个内容的重...
    咻咻咻滴赵大妞阅读 5,087评论 0 1
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,712评论 1 41
  • 一、元素选择器 作用:通过元素选择器可以选择页面中的所有指定元素语法:标签名{} 二、类选择器 作用:通过元素的c...
    风中丶凌乱阅读 2,707评论 0 1
  • 和 em标签用于表示一段内容中的着重点。 strong标签用于表示一个内容的重要性。这两个标签可以单独使用,也可以...
    2simple阅读 4,818评论 0 0
  • 文本标签 和 em标签用于表示一段内容中的着重点。strong标签用于表示一个内容的重要性。这两个标签可以单独使用...
    幸而0407阅读 3,315评论 0 0

友情链接更多精彩内容