14. 块级元素和行内元素
块级元素和行内元素有着截然相反的性质：
- 块级元素独占一行，能设宽高，如果不写width则会自动撑满。比如div、h系列、p、li、section、header、nav等；
- 行内元素并排出现，不能设置宽高。比如a、span、em、strong、b、u、i等。
还有一个群体，是特殊的“行内块”，像img标签、表单元素天生就是行内块元素，它们既能够并排，又能够设置宽高。
通过display属性可以更改元素的块级/行内/行内块属性：
display: block; /* 转为块级元素 */
display: inline; /* 转为行内元素 */
display: inline-block; /* 转为行内块 */
a {
position: absolute;
width: 30px;
height: 30px;
background-color: orange;
}
这个a标签因为已经绝对定位了，所以就脱标了，所以就能够依法设置宽度和高度了。
16. 绝对定位水平居中
绝对定位的元素不能使用 margin: 0 auto; 进行水平居中，此时就要使用全新的居中办法：将left设置为50%，margin-left设置为负的 自己宽度的一半。一定要注意是”负的”哦。
垂直居中也一样，只需要将top设置为50%，margin-top设置为负的自己宽度的一半即可。
17. 子绝父相
默认情况下，绝对定位元素的定位参考点是网页。比如 top: 0; left: 0; 元素就会跑到网页的左上角去。
那么，如何让绝对定位的元素能够被一个大盒子限定住呢？即，让这个大盒子成为绝对定位元素的参考点。此时就要使用“子绝父相”。给大盒子设置相对定位即可。
扩展知识：
-
事实上，绝对定位的元素的定位参考是这样的：绝对定位的元素，会寻找自己祖先中，离自己最近的，且已定位祖先元素。
-
这句话什么意思呢？就是说，“子绝父绝”也是可以的，只要父元素定位了，就能成为参考点，不一定是相对定位。
-
另外，“子绝爷爷相”也是可以的，不一定是父亲相对定位哦，爷爷如果加上相对定位，那么爷爷就把元素框住了。 这个拓展知识大家简单了解一下即可，在工作中，最常见的还是“子绝父相”。因为相对定位稳定，不脱标，是唯一有实战价值的。
-
精灵图
CSS精灵或者CSS雪碧图，就是把网页中一些小图片整合到一张图片文件中，再利用CSS的background-image、background-position进行背景定位，从而可以精确展示出想要的背景图片。
利用CSS精灵能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS精灵最大的优点，也是其被广泛传播和应用的主要原因；
此时，使用CSS精灵，使更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式，整个网页的风格就可以改变。维护起来更加方便。比如，圣诞节来了，我们可以只需要更改一张精灵图，这样就能够更改网页上的所有案例样式。
19. 伪元素
CSS伪元素是“两个冒号”的选择器，表示给元素设置特定部分的样式。比如 ::before 表示设置元素内部原有内容之前的内容，::after 表示设置元素内部原有内容之后的内容。在实战中，经常使用 ::before 和 ::after 当做盛放图片的容器，经常结合绝对定位、CSS精灵一起使用。
