《CSS in depth》笔记（第二-三章）
响应式指的是网页内容根据浏览器窗口的大小自动适应。
对于em：在一个样式类里指定了字号px值，再设置padding为1em, 那么padding的值就跟字号px值相同，称为计算值。改变了指定的字号或者继承的字号值的时候，padding(margin, height, width, border-radius)会跟着改变。如果设置font-size: 1.2em; 是指的字号大小为父元素的1.2倍。如果同时指定了font-size和其他元素的em值，则先根据父元素的字号计算出来子元素的字号，再根据字号大小计算其他元素的大小。
rem是指相对于浏览器默认字体的相对值。一般用px指定边框，rem指定字号，em指定其他border-radius等的值。
em和rem都是相对于font-size进行定义。此外还有vh,vw, vmin, vmax.
关于CSS变量：
–xxx : yyy ; 的方式定义，var(–xxx)的方式使用。主要的意义在于，可以在网页的不同地方重新定义同名变量，从而可以有不同的样式。
普通文档流：指的是网页元素的默认布局行为。行内元素跟随文字的方向从左到右排列，当到达容器边缘时换行。块元素会占据完整的一行，前后都有换行。
使用百分比来指定高度是有问题的，百分比相对于父容器，而父容器的高度一般取决于子元素，死循环了，所以浏览器会忽略父元素的高度声明。要想让这个声明生效，需要给父元素一个明确定义的高度。现代css一般使用css表格布局或者flexbox两种方式来实现等高列布局。
关于垂直居中：使用vertical-align的话，块级元素不会生效，只对行内元素或者table-cell布局的元素生效。
负外边距：top/left ->向左或者向上移动；right/bottom->后面的元素向左或者向上移动（导致重叠）。
外边距折叠：折叠外边距的大小等于相邻外边距的最大值。只有上下margin会折叠，左右不会。
边距的demo:
