作为一个前端，相信大家最先接触应该都是HTML吧？在HTML中很多人可能都没有把什么叫标签，什么叫元素这个概念搞清楚，为了把这个大家不曾留意的易混淆的搞清楚，特作此一文彻底解决掉这个问题！

　　首先我们来看概念

　　1.标签

  1. 由尖括号包围的关键词，比如 <html>
  2. 通常是成对出现的，比如 <div> 和 </div>
  3. 标签对中的第一个标签是开始标签，第二个标签是结束标签；
  4. 开始和结束标签也被称为开放标签和闭合标签。
  5. 也有单独呈现的标签，如：<img src="百度百科.jpg" />等。
  6. 一般成对出现的标签，其内容在两个标签中间。单独呈现的标签，则在标签属性中赋值。如<h1>标题</h1>和 <input type="text" value="按钮" />。
  7. 网页的内容需在<html>标签中，标题、字符格式、语言、兼容性、关键字、描述等信息显示在<head>标签中，而网页需展示的内容需嵌套在<body>标签中。某些时候不按标准书写代码虽然可以正常显示，但是作为职业素养，还是应该养成正规编写习惯。

　　2.元素

　　1.HTML 元素以开始标签起始

　　2.HTML 元素以结束标签终止

　　3.元素的内容是开始标签与结束标签之间的内容

　　4.某些 HTML 元素具有空内容（empty content）

　　5.空元素在开始标签中进行关闭（以开始标签的结束而结束）

　　6.大多数 HTML 元素可拥有属性

　　通过对比我们可以清楚的了解到，HTML标签是超文本标记语言的最基本单位，而HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。标签不区分大小写，但是官方建议小写。

　　现在超文本标记语言发布第五个版本。那就是大名鼎鼎的HTML5.顺便吐槽一句，现在许多外行，包括部分脑残码农，张口闭口就是你们做h5的怎么怎么滴，在此我只想大喊一声：“我们是前端工程师，Front End Engineer！！！我们会的不仅仅是HTML ! OK？”

HTML中标签和元素的区别的更多相关文章

  1. css中伪类与伪元素的区别

    一:伪类:1:定义:css伪类用于向某些选择器添加特殊效果. 伪类其实与普通的css类相类似,可以为已有的元素添加样式,但是他只有处于dom无法描述的状态下才能为文档树中的元素添加样式,所以将其称为伪 ...

  2. css中伪类和伪元素的区别

    转载:http://www.cnblogs.com/ihardcoder/p/5294927.html CSS3伪类和伪元素的特性和区别   前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常 ...

  3. html中内联元素和块级元素的区别

    1.下表列出了内联元素和块级元素的主要区别 html中内联元素和块级元素的区别 块级元素 行内元素 独占一行,默认情况下,其宽度自动填满其父元素宽度 相邻的行内元素会排列在同一行里,直到一行排不下,才 ...

  4. （实用篇）PHP中unset,array_splice删除数组中元素的区别

    php中删除数组元素是非常的简单的,但有时删除数组需要对索引进行一些排序要求我们会使用到相关的函数,这里我们来介绍使用unset,array_splice删除数组中的元素区别吧 如果要在某个数组中删除 ...

  5. PHP中unset,array_splice删除数组中元素的区别

    php中删除数组元素是非常的简单的,但有时删除数组需要对索引进行一些排序要求我们会使用到相关的函数,这里我们来介绍使用unset,array_splice删除数组中的元素区别吧 如果要在某个数组中删除 ...

  6. spring bean中的properties元素内的ref和value的区别；* 和 ** 的区别

    spring bean中的properties元素内的ref和value的区别 至于使用哪个是依据你所用的属性类型决定的. <bean id="sqlSessionFactory&qu ...

  7. delete 和 splice 删除数组中元素的区别

    delete 和 splice 删除数组中元素的区别 ` var arr1 = ["a","b","c","d"]; d ...

  8. HTML中行内元素与块级元素的区别：

    HTML中行内元素与块级元素的区别:在标准文档流里面,块级元素具有以下特点: ①总是在新行上开始,占据一整行:②高度,行高以及外边距和内边距都可控制:③宽带始终是与浏览器宽度一样,与内容无关:④它可以 ...

  9. jsp中两种include的区别【转】

    引用文章:http://www.ibm.com/developerworks/cn/java/j-jsp04293/ http://www.cnblogs.com/lazycoding/archive ...

随机推荐

  1. raid之理解

    RAID方案有两种,一种是硬件RAID解决方案,一种是软RAID解决方案. 硬件RAID解决方案 1.RAID 0 RAID 0是最早出现的RAID模式,即Data Stripping数据分条技术.R ...

  2. Ubuntu安装node.js

    通过PPA安装Node.js sudo apt-get install python-software-properties sudo add-apt-repository ppa:chris-lea ...

  3. 菜单练习-关机&取消

    #include<stdio.h> #include<string.h> #include<stdlib.h> #include<time.h> voi ...

  4. Exel 利用模板导出方法

    #region Exel导出方法 [MaxuniAuthAttribute(Roles = "sysroles")] public void OrderExport(string ...

  5. [POJ 2420] A Star not a Tree?

    A Star not a Tree? Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 4058   Accepted: 200 ...

  6. [.NET WebAPI系列02] WebAPI 中的HTTP通信

    [前言] 本节用于承上启下,通过第一节了解的WebAPI的基本语法,Controller CRUD方法的基本格式: 但很多场合,第一节中的Web API Controller方法返回的信息 过于简单, ...

  7. 【转】Android自定义View的实现方法，带你一步步深入了解View(四)

    原文网址: 转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到 ...

  8. [Bhatia.Matrix Analysis.Solutions to Exercises and Problems]ExI.2.6

    If $\sen{A}<1$, then $I-A$ is invertible, and $$\bex (I-A)^{-1}=I+A+A^2+\cdots, \eex$$ aa converg ...

  9. POJ 3107-Godfather（树形dp）

    题意: 有n个节点的树,删除一个点,得到的最大联通分支最小,求这样点的集合 分析: dp[i]表示删除i所得最大联通分支,遍历一遍节点即可,该题用vector会超时 #include <map& ...

  10. js基础第四天

    多个tab栏切换class封装 <style>         *{margin:0;padding:0;}         ul{list-style:none;}         .b ...