3.1 元素相关术语说明
原创声明。未经许可，不得转载，作者：小步教程。
本节介绍元素的常用术语。示例代码如下。
<html>
<body>
<h1>小步教程</h1>
<div>
<span id="span1">小步教程</span>
<span id="span2">xiaobuteach.com</span>
<span id="span3">小步教程</span>
</div>
</body>
</html>
3.1.1 标签/元素
标签tag：不具体指哪一个节点，侧重说明标签本身的特性。
描述示例：“span标签的特点不换行，设置宽度无效”，“上述代码共5种标签”。
元素element：具体指特定节点，侧重说明某个节点。
描述示例：“上述代码共7个元素，3个span元素都是最底层元素”。
两个术语有较强关联，有时混用。w3c与MDN主要使用“元素”。
混用示例：“span元素的特点不换行，设置宽度无效”
3.1.2 元素级别关系
（1）根元素。顶层元素即根元素，规范HTML页面的根元素总是html元素。
（2）父元素与子元素。3个span元素的父元素是div；父元素有且只有一个（根元素html没有父元素）；body的子元素是h1与div。子元素可能有0个、1个或多个。
（4）兄弟元素。兄弟元素平级，它们的父元素是同一元素。3个span元素互相是兄弟元素。
（5）相邻兄弟元素。兄弟元素细分为相邻兄弟与不相邻兄弟。span1与span2是相邻兄弟，span2与span3是相邻兄弟，span1与span3不是相邻兄弟。
3.1.3 根据属性值简称元素
inline元素表示display: inline的元素；block元素表示display: block的元素。
static元素表示position: static的元素；relative元素表示position: relative的元素。
以此类推，属性值+元素 表示 属性名: 属性值的元素。为简化表达，经常省略属性名。
3.1.4 属性与元素级别结合简称元素
flex容器：表示display: flex元素。flex子元素：表示display: flex元素的子元素。
<div id="div1" style="display: flex;">
<div id="div2">第1列</div>
<div id="div3">第2列</div>
<div id="div4">第3列</div>
</div>
div1是flex容器，div2~div4是flex子元素。
