前端高频面试题 CSS篇 (3)

!important > 行内样式 > ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性
同一优先级的选择器，后写的会覆盖之前的。

12.水平垂直居中布局？

方案一：flex布局

.center-flex { display:flex; justify-content:center; align-items:center; }

方案二：position transform

.father { position: relative; } .son { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); } 13.两列等高布局？

方案一：flex布局

.equalHeight-flex { display: flex; }

方案二：浮动布局

.equalHeight-float-father { overflow: hidden; } .equalHeight-float-son { float: left; width: 300px; margin-bottom:-2000px; padding-bottom:2000px; }