css综合

说一说你平时写代码遵守的编码规范

• css的“:”后加个空格
• “{”前加个空格
• “}”单独成行
• 每条声明后都加上分号
• 用“-”代替连续单词间的空格

垂直居中有几种实现方式，给出代码范例

• 绝对定位

position: absolute; 
top: 50%;
transform: translateY(-50%); /*这是CSS3新属性，也可以用 margin-top: -150px;即自身高度的一半 */
width: 400px;
height: 300px;

• vertical-align

.box:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle; /*在把box设置vertical-align: middle即可实现居中*/
}

• table-cell

display: table-cell;  
vertical-align: middle; 

• flex

body {
            display: flex;  /*对父元素设置flex*/
            align-items: center; 

jsbin