1. 頁面頂部陰影

body:before{
    content: "";
    position: fixed;
    top:-10px;
    left: 0;
    width: 100%;
    height: 10px;
    box-shadow: 0px 0px 10px rgba(0,0,0,.8);
    z-index: 100;
}

2. 給 body 添加行高

你不需要分別添加 line-height 到每個p,h標記等。只要添加到 body 即可：

    body {

      line-height: 1;

    }

line-height:1; 的意思是 根據該元素本身的字體大小 設置行高 比如該元素字體是15px line-height:1; 的行高就是15px;

3. 所有一切都垂直居中

    html, body {

      height: 100%;

      margin: 0;

    }

    body {

      -webkit-align-items: center;  

      -ms-flex-align: center;  

      align-items: center;

      display
 
: -webkit-flex;

      display: flex;

    }

看情況而定，不是很實用；

2017年總結的前端文章——CSS高級技巧匯總