一、HTML基础：
详细信息可参考MDN的HTTP文档
html元素可划分为三个层级：
- Top-Level（顶级元素）：html,body,frameset;
- block-Level（块级元素）: 块级元素列表 如：div p h1~h5 ul 等
- 可以设置元素的高度宽度边距等；
- 块级元素占据其父元素（容器）的整个空间，元素宽度未设置时，默认为本身父容器的100%
- 块级元素会新起一行
- inline（内联元素/行内元素）:内联元素列表 如：<a> <span> <br>等
- 只能包含数据和其它内联元素，和其它元素都在一行上
- 高度宽度边距等不可设置；
- 元素的宽度就是她包含的文字或图片的宽度，不可改变
二、css的margin、padding区别
https://www.cnblogs.com/HDK2016/p/6127856.html这篇博客讲的比较详细
每个块级元素有四个边：外边距边 边框边 内填充边 内容边
margin: margin详解，指自身边框与另一个容器边框的距离，因此多被称为外边框
padding：padding详解，指元素内容与其边界之间的距离，多被称为内边距，不能为负值
- 如果内容区域content area设置了背景、颜色或图片，这些样式会延伸到padding上