HTML 笔记之 HTML 元素的概念
- HTML 不是编程语言，它是一种标记语言
- HTML 中常见的几个名词是 元素、 标签(开始标签和结束标签)、 属性、 元素内容
- 这篇文章将要介绍的是 HTML 元素的概念
元素的概念
例子：
<html>
<body>
<a href="http://www.baidu.com">点击跳转到百度</a>
</body>
</html>
运行结果为：
***
上面是一个超链接的例子，点击上面的文字 “点击跳转到百度”，就可以跳转到百度的页面了。
现在我们从上面的代码中抽取一部分代码，如下所示：
<a href="http://www.baidu.com">点击跳转到百度</a>
一个元素一般包括标签、属性(属性的名称和属性的值)、元素内容，所以说这部分代码就是一个元素。
| 标签 | 属性的名称 | 属性的值 | 元素内容 |
|---|---|---|---|
| < a > < /a > | href | http://www.baidu.com | 点击跳转到百度 |
注意：
- 有时会有这样的说法，例如：< a > 元素 。 我们知道 < a > 、< /a > 、 < html > 、 < /html > 、 < body > 、 < /body > 等这些都是标签，这时可能我们就会有点迷惑了，< a > 是标签，为什么又会有 < a > 元素 这样的说法呢？ 其实不用太纠结，这只是两种不同的说法，习惯性的说法是 < a > 元素、 < html > 元素，此时我们只要知道 < a > 元素这样的说法表示上面表格列出的所有东西，即标签、属性、元素内容，但是如果是 < a > 标签这样的说法，那就真的只是表示 < a > 这个标签了。
- 一个元素一般包括标签、属性、元素内容，但是也有比较特别的元素，例如：< br > 。
- 元素是可以嵌套的，一个元素可以包含另一个元素，例如上面的例子中， < body > 元素包含 < a > 元素，这时 < a > 元素就是 < body > 元素的元素内容，< html > 元素包含 < body > 和 < a > 元素，那么这两个都是 < html > 元素的元素内容。
总结：
- 注意区分 < a > 元素 和 < a > 标签 这两种说法。
- 以 < br > 元素为特殊元素的代表，下面举了一个相关的例子。
- 在开始标签和结束标签之间的内容就为该元素的元素内容，例如：< a > 元素的内容为 点击跳转到百度。
与 < br > 相关的例子：
<html>
<body>
<p>这是一个换行元素</p>
<p>这是一个<br/>换行元素</p>
</body>
</html>
运行结果为：
这是一个换行元素
这是一个
换行元素
***
我们可以从运行结果中看到，< br > 元素的效果是将文字换行了。
在编写代码时一般写成 < br / > 。
我们可以看到，< br > 元素是没有结束标签的，我们知道一个元素的元素内容是指在开始标签与结束标签之间的内容，换句话说 < br > 元素是没有元素内容的，我们也称这类元素为空元素。
注意，空元素没有元素内容，但可以有属性，例如：< img src="图片.jpg" width="100" height="150" / > 。
End~
HTML 笔记之 HTML 元素的概念的更多相关文章
- HTML中块元素与内联元素的概念
HTML中块元素与内联元素的概念 div就是一个块元素,所谓的块元素就是会独占一行的的元素,无论他的内容有多少,他都会独占一整行. p h1 h2 h3 ... div这个标签没有任何语义,就是一个纯 ...
- CSS的块级元素和内联元素的概念
三生有幸,偶然之下知道了<CSS世界>这本书,让我产生了探究 CSS 的想法. 这里对 CSS 中的块级元素和内联元素的概念做一个简单的整理. 可能对于我们前端开发人员来讲,一般接触到的元 ...
- Shiro笔记（一）基本概念
Shiro笔记(一)基本概念 一.简介 Shiro是一个Java安全框架,可以帮助我们完成:认证.授权.加密.会话管理.与Web集成.缓存等. Authentication:身份认证/登录,验证用户是 ...
- AME_AME审批中子元素的概念和用途（概念）
2014-05-30 Created By BaoXinjian AME: Oracle Approvals Management AME的6个元素的概念和主要作用: Attribue -> ...
- Vue.js学习笔记：在元素 和 template 中使用 v-if 指令
f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- 机器学习框架ML.NET学习笔记【1】基本概念与系列文章目录
一.序言 微软的机器学习框架于2018年5月出了0.1版本,2019年5月发布1.0版本.期间各版本之间差异(包括命名空间.方法等)还是比较大的,随着1.0版发布,应该是趋于稳定了.之前在园子里也看到 ...
- html5--1.3 元素的概念与3个常用标签
html5--1.3 元素的概念与3个常用标签 学习要点 1.元素的概念 2.3个常用的标签 HTML 元素指的是从开始标签到结束标签的所有代码. 开始标签 元素内容 结束标签 <h1> ...
- Python3+Selenium3+webdriver学习笔记10（元素属性、页面源码）
#!/usr/bin/env python# -*- coding:utf-8 -*-'''Selenium3+webdriver学习笔记10(元素属性.页面源码)'''from selenium i ...
- CLR via C#深解笔记一 - CLR & C# 基础概念
写在前言 .Net Framework并不是Win 32 API 和COM上的一个抽象层. 某种程度上,它是自己的操作系统,有自己的内存管理器,自己的安全系统,自己的文件加载器,自己的错误处理 ...
随机推荐
- 杭电acm 1040题
本题是一个非常简单的升序排序题目,但那时在做的时候把题目看错了,导致花费了大量的时间来检查为什么WA,最后发现题目看错了..... /********************************* ...
- Hive与Hbase结合使用
hive的启动需要使用到zookeeper, 所以, 要么自己搭建zookeeper, 要么跟其它东西一起使用, 我这里做的是跟hbase一起使用的zookeeper, 因为hbase自带zookee ...
- Linux 启动顺序
Linux 启动顺序:1. BIOS自检2. 运行系统内核并检测硬件3. 运行系统的第一个进程init4. init读取系统引导配置文件/etc/inittab中的信息进行初始化 ...
- Multi-task Pose-Invariant Face Recognition 论文笔记
摘要: 在不受限制的环境中拍摄的人脸图像通常包含显著的姿态变化,这会显著降低设计用于识别正面的算法的性能.本文提出了一种新颖的面部识别框架,能够处理±90°偏航范围内的全方位姿势变化.所提出的框架首先 ...
- NPOI导出EXCEL部分样式不起作用
在使用NPOI导出excel的时候,设置cell样式,数据量多余6条之后,在后面几条数据没有样式(边框,对其,换行等). 原因是设置CellStyle的时候把CreateCellStyle放在循环列集 ...
- [Windows]获取当前时间（年/月/日/时/分/秒）
struct tm* GetCurTime(time_t inTime) { struct tm* curTime = localtime(&inTime); curTime->tm_y ...
- Java面向对象的三大特性 继承
继承是类与类的一种关系,是“is a"关系 子类拥有父类的属性和方法,private除外 class 子类 extends 父类 方法的重写 调用方法时会优先调用子类的方法 重写时,返 ...
- Reboot
目标是将浏览器的预设样式设为一致 Native font stack 本机字体堆栈 由于padding 及 border 会改变元素在运算后的宽度 此时的实际宽度为: width+左右padding ...
- 2.python中的矩阵、多维数组----numpy
最近在将一个算法由matlab转成python,初学python,很多地方还不熟悉,总体感觉就是上手容易,实际上很优雅地用python还是蛮难的.目前为止,觉得就算法仿真研究而言,还是matlab用得 ...
- [Xcode 实际操作]四、常用控件-(1)UIButton控件的使用
目录:[Swift]Xcode实际操作 本文将演示按钮控件的使用,按钮是用户界面中最常见的交互控件 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import U ...