#007_Concept_Parent_Child
最近的写的内容都太功利，都是直接照抄代码出页面效果的，这样不行，现在要补补基础。
那么今天，要讲的是一个父、子、先祖、后代、兄弟姐妹关系
什么是父子关系?
<html>
<head>
</head>
<body>
</body>
</html>
我们随便对一个网页查看元素（右键页面、或者按F12），可以看到上面这个结构。
其中，head 元素和 body 元素，是 html 元素的子代，也就是 html 元素是 head 和 body 的父代，先有 html 才能有 head 和 body ，就像人类社会一样。
什么是先祖后代关系?
我们将注意力集中到 body 上，它里面有两个元素，一个是 h3 标题元素，一个是 p 段落元素。body 同时是 h3 和 p 的父代，h3 和 p 都是 body 的子代。而 h3 也有自己的子代 span ， p 也有自己的子代 strong 。
那么对于 body 来说， span 和 strong 就是它的后代。
对于 span 和 strong 来说，body j就是它们的先祖。
而 p 、h3 、span 、strong 都是 html 的后代 , body 不是， body 是 html 的子代。
什么是兄弟姐妹关系？
其实这个原文是 sibling ，我不想被说性别歧视，所以还是把兄弟姐妹全搬上来。
如我们所知的，h3 和 p 是同一个老父亲 body 出来的，所以它们是兄弟/姐妹。那么， strong 和 span 什么关系？strong 和 h3 什么关系？
哦，它们没关系，这点和人类社会是不同的。后代元素只认和它并列的结构、或是那些将属性继承给它们的父代、先祖。
body 的属性 bgcolor="#cccccc" 这个属性会传给他的子代 h3 和 table ，也会传给它的后代 span 、tbody 、tr 等等一系列元素，但是 table 的属性 bgcolor="#d7dfdf" 只会传给它的子代和后代 tbody 、tr 、td 等等元素。但是 table 的属性不会传给 span 。
所以 h3 的 span 和 table 一点关系都没有。
我搞懂它们的关系有什么用？
这将在之后运用到类似JavaScript、需要考虑后代选择器的时候起到作用。（当然不是近期，更不是现在）
现在需要掌握的是：
1、正确的分辨、认知各个元素之间的关系
2、正确的将元素，按照关系和规则，编写好代码
我们大可以把代码不按关系、不按规则写成这样——
（dt元素：我当你是兄弟，你却想做我爸爸！！！）
甚至这样都能出页面效果，但是要养成良好的编写习惯，才能让之后在复杂功能中少出bug。
