CSS不正交
- 各属性间互相影响
- margin vs border：margin默认情况下会合并，如父子margin合并，给父元素加border或padding后可解决，display：inline-block/flex/table/table-cell、overflow：hidden可使其分开
- 小圆点 vs display 如ul>li有小圆点，因为其display默认是list-item，改为block，inline等其他值则小圆点消失
- position:absolute vs display:inline/inline-block，设置了绝对定位后即使设置display为这两个值也无效，会被改成block
- 各元素间互相影响
- position:fixed vs transform 设置前者本来是相对窗口定位，但若给父元素transform：scale（），则子元素相对父元素定位
- float vs inline元素 float不是真正的浮动，其最初的设计也是为了图文混排，所以后面元素中的文本是可以识别出浮动元素的
CSS常用功能
- 居中
- 水平居中
- 块级元素：若子元素宽度不定，设置左右margin相同
若子元素宽度确定，设置左右margin为auto - 行内元素：在父元素中设置text-align:center
- 块级元素：若子元素宽度不定，设置左右margin相同
- 垂直居中
- 父元素高度不定，设置其上下padding相同
- 父元素高度确定，IE设display:table，chrome设display:flex
- 水平居中
- 用CSS3 generator工具自动生成CSS~
。。。后续继续补充
