其他分享
首页 > 其他分享> > DOM文本标签

DOM文本标签

作者:互联网

	平时常见的h1,p等这里就不介绍了,补充一些以前没见过的文本标签

一、引用文本

   <div>
        <q>引用内容<cite>引用的出处或来源</cite><a href="http://www.baidu.com"><cite>http://www.baidu.com</cite></a></q>
        <p>段落文字段落文字<blockquote>引用内容引用内容引用内容引用内容<cite>引用的出处或来源</cite></blockquote></p>
    </div>

特点:

  1. q会使文字内容用引号引起来
  2. blockquote会使文字内容前后都有缩进,blockquote应包含在块元素中
  3. cite会使文本以斜体显示,常与a标签配合使用;q与blockquote都有cite子元素

在这里插入图片描述
二、强调文本

<em></em>
<strong></strong>

区别:

  1. em是斜体,storng是加粗
  2. strong表达的强调程度更深

三、格式文本

<i></i>
<big></big>
<small></small>
<sup></sup>
<sub></sub>

特点:

  1. i斜体
  2. big较大字体,small较小字体(亲测chrome下无效)
  3. sup上标,如要写m³的3,把3用sup包裹即可
  4. sub下标

四、输出文本

        <code>表示代码字体,即显示源码</code>
        <pre>保留源代码格式,比如空格换行</pre>
        <tt>打印机字体</tt>
        <kbd>键盘字体</kbd>
        <dfn>定义的术语</dfn>
        <var>变量字体</var>
        <samp>代码范例</samp>
其中<pre></pre>常用来显示源代码

五、缩写文本

        <abbr title="addr标签的作用">定义简写或缩写,通过对缩写进行标记,为浏览器搜索引擎提供有用的信息</abbr>
        <acronym title="CSS">Cascading Style Sheets</acronym>
<!--H5不支持acronym-->

在这里插入图片描述

六·、插入、删除文本

<ins>要插入的文本,文本效果会有下划线</ins>
<del>要删除的文本,文本效果会有中划线</del>

特点:

  1. 都有cite和datetime属性,cite值为url地址,datetime值为时间,这两个属性在浏览器没有视觉效果,但可以通过js获取该属性的值
  2. ins下划线,del中划线

七、文本方向

<bdo dir="rtl">努力学习</bdo>
<bdo dir="ltr">努力学习</bdo>

在这里插入图片描述
该标签只有dir属性,属性值为rtl或ltr,可按照缩写记忆

标签:DOM,标签,字体,引用,文本,cite,属性
来源: https://blog.csdn.net/weixin_43939111/article/details/113564833