您的位置：首页 > Web前端 > HTML

HTML标签之常见格式标签（1）

2017-01-23 22:01 489 查看

<abbr>、<cite>标签

<abbr>标签表示一种缩写词或首字母的缩略词，例如“WWW”或“USA”等，在某些浏览器中，当鼠标移动到带有<abbr>标签的缩写词上时，<abbr>标签带有的title属性会展示缩写词的全称。
<cite>表示定义作品（影视、画、节目、歌曲等）的标题。注：人名不属于作品的标题。

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>abbr标签</title>
</head>
<body>

<h1>abbr 表示一种缩写词或首字母的缩略词</h1>

<p>The <abbr title="I Love You">ILVY</abbr> is love</p>

<p>The<abbr>ILVY</abbr>（I Love You）is love</p>

<p><cite>背影<cite>是朱自清先生的作品</p>

</body></html>

效果如下：

<address>标签

<address>表示作者或所有者的联系信息，如姓名、联系方法、地址等，通常为斜体。注：address中不能描述邮政地址，除非该地址是联系信息的组成部分。

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>address标签</title>
</head>
<body>

<address>
姓名：jon<br>
联系方式:123456<br>
地址：<a href="www.xxxx.com">xxx</a>
</address>

</body>
</html>

、、、、、、

标签表示粗体，根据HTML5规定，在没有其它标签可以用时，作为最后的选择，标题用<h1>~<h6>表示，强调用表示，标签使文本以斜体形式显示，重点用表示，高亮度显示用表示，用于为文本添加下划线。定义小号字体，一般用于页面最低端。

注：标签显示的文本也是斜体，若只让文本以斜体形式显示，用。
当需要表示粗体、斜体、小号字体时，建议使用CSS样式表示，尽量不使用以上标签，原因：使内容和样式分离，便于维护、管理。

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>b em strong mark</title>
</head>
<body>

<p>这是 <b>加粗文本</b>。</p>

<p>这是 <em>强调文本</em>。</p>

<p>这是 <i>重点文本</i>。</p>

这是 重点文本。 这是 高亮度文本。 </body></html>

效果如下：

以上表示的文本样式也可通过CSS表示。

<bdi>、<bdo>与属性dir

dir属性定义文本的显示方式，值有："ltr"从左至右显示 "rtl"从右至左显示。

<bdo>标签表示覆盖默认的文本方向,与dir联用。默认方向文本文字从左向右显示。

<bdi>标签表示设置一段文本，使其脱离其父元素的文本方向设置，与dir联用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<p dir="rtl">该段落文字从左到右显示。44444</p>

<p><bdo dir="rtl">该段落文字从右到左显示。</bdo>4</p>
<p><bdo dir="rtl">该段落文字从右到左显示。</bdo>e</p>

<p><bdi dir="rtl">该段落文字从右到左显示。！！</bdi>4</p>
<p><bdi dir="ltr">该段落文字从右到左显示。！！</bdi>4</p>

</body>
</html>

<blockquote>、<q>标签

<blockquote>标签表示块引用，将自动为引用段落进行缩进，一般为长句。

<q>如果标记是不需要段落分隔的短引用，一般为短句，自动加双引号。

cite属性表示引用源。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob
c18b
.com)</title>
</head>
<body>

<h1>About WWF</h1>
<p>Here is a quote from WWF's website:</p>

<q cite="www.baidu.com">Here is a quote from WWF's website</q>

<blockquote cite="http://www.worldwildlife.org/who/index.html">
For 50 years, WWF has been protecting the future of nature. The worlds leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.
</blockquote>

</body>
</html>

<del>、<ins>、<s>标签

<del>标签定义已删除的文本。

<ins>标签定义插入的文本。

<s>标签表示不正确的、没有用的文本。浏览器自动为文本添加删除线。

提示：<del>
和 <ins> 一起使用，描述文档中的更新和修正。浏览器通常会在已删除文本上添加一条删除线，在新插入文本下添加一条下划线。

<s>只表示不正确的文本，浏览器自动为文本添加删除线，若要表示已删除的文本，则用<del>代替。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<p>My favorite color is <del>这是一段已删除的文本</del> <ins>这是新添加的文本</ins>!</p>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<p><s>这是一段不正确的文本</s></p>
<p>此段文本是正确的</p>

</body>
</html>

<pre>标签

<pre>定义预格式化的文本，预格式化的文本保留空格、换行符，多用于表示计算机的源代码。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<pre>
我 是一只 小小 小小    小鸟

小小    小鸟
</pre>

</body>
</html>

提示：<del>
和 <ins> 一起使用，描述文档中的更新和修正。浏览器通常会在已删除文本上添加一条删除线，在新插入文本下添加一条下划线

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： HTML 编程

相关文章推荐

新的分享