HTML中的标签和元素的区别详解

  发布时间:2013-04-22 14:44:28   作者:佚名   我要评论
很多人可能都没有把哪个叫标签,哪个叫元素这个概念搞清楚,包括之前的我也是,一直都是混淆着,特意搜索查阅了一些资料,现将我得出的结论写出来,与大家分享下
相信很多初学网页的朋友都和我一样,搞不明白HTML中元素、标签、属性之间到底是怎么定义的,元素和标签有什么区别。为了彻底弄明白,我特意搜索查阅了一些资料,现将我得出的结论写出来,分享给和我有着同样迷惑的网友们:

很多人可能都没有把哪个叫标签,哪个叫元素这个概念搞清楚,包括之前的我也是,一直都是混淆着。
事实上两者之间的概念还是很清楚的:
比如<p>这就是一个标签;
<p>这里是内容</p>这就是一个元素,也就是说元素由一个开始的标签和结束的标签组成,用来包含某些内容;
这里有一个值得注意的例外,即<br/>本身既是开始标签也是结束标签,但不包含任何内容,所以这只是个标签。

1. 元素

HTML网页实际上就是由许许多多各种各样的HTML元素构成的文本文件,并且任何网页浏览器都可以直接运行HTML文件。所以可以这样说,HTML元素就是构成HTML文件的基本对象,HTML元素可以说是一个统称而已。HTML元素就是通过使用HTML标签进行定义的。

2. 标签

标签就是<head>、<body>、<table>等被尖括号“<”和“>”包起来的对象,绝大部分的标签都是成对出现的,如<table></talbe>、<form></form>。当然还有少部分不是成对出现的,如<br>、<hr>等。

标签就是用来标记HTML元素的。位于起始标签和结束标签之间的文本就是HTML元素的内容。

3. 属性

为HTML元素提供各种附加信息的就是HTML属性,它总是以"属性名=属性值"这种名值对的形式出现,而且属性总是在HTML元素的开始标签中进行定义。

示例

<html> <head> <title>示例标题</title> </head> <body bgcolor="red"> <p>这是示例页面</p> </body> </html> 在这个示例中,<p>这是示例页面</p>就是HTML元素,其中“这是示例页面”就是元素的具体内容了。 <head><title><body>等就是HTML标签,这是标签构成了HTML元素。 <body bgcolor="red">中的bgcolor="red"就是标签的属性,它定义了标签应该如何具体配置。 总之,元素和标签的区别也不必太在意,实际工作中我们都直接以标签统称。而属性就很容易明白了, 它就是为HTML标签添加各种附加信息或者配置选项的参数。

相关文章

  • 详解XML中的标签与元素的使用

    这篇文章主要介绍了XML中的标签与元素的使用,是XML入门学习中的基础知识,需要的朋友可以参考下
    2016-02-14
  • div标签中的元素margin-top失效的解决方法

    元素上级标签是div,已经设置了width和height等的属性,可是,在对元素使用margin进行调整的时候,无法生效,下面有个不错的解决方法,感兴趣的朋友可以参考下
    2014-02-17
  • HTML5在a标签内放置块级元素示例代码

    你没看错:用一个A标签包裹块级元素,在HTML5以前,a标签属于行内元素,而div,h1,p 等为块级元素,如果强行包裹,可能会被强行截断为多个a标签,感兴趣的朋友可以了解些
    2013-08-23
  • HTML标签及基本元素学习总结

    最近学习了一些html的知识,以防忘记所以整理了一下,以备不时之需。主要由html的基本元素到超链接、图像之类的,感兴趣的朋友可以参考下哈,希望对大家有所帮助
    2013-06-26
  • css 背景透明 元素(标签)背景透明的css设计

    今天要设计一个定位在图片上的标签,标签的背景要有一定的透明度,使用到了opacity的属性,过去没太注意这个属性的兼容性问题,结果很是郁闷
    2013-01-09
  • 标签 li 是不是块级元素分析

    块级元素:block-level,相信大家都知道吧(or Google it)。以前在写代码的时候,面对
  • 标签总觉得很奇怪。
2011-04-26
  • HTML元素(标签)大全及使用介绍

    HTML元素(标签)大全及使用说明
    2010-07-04
  • HTML 元素 标签教程

    HTML文档是由HTML元素组成的文本文件。 HTML元素是预定义的正在使用的HTML标签。 HTML标签通常成对出现
    2009-07-16
  • 元素绝对定位以后设置了高宽,a标签不能点击的原因及解决方法

    下面小编就为大家带来一篇元素绝对定位以后设置了高宽,a标签不能点击的原因及解决方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • 最新评论

    微信 投稿 脚本任务 在线工具