2017年總結的前端文章——CSS高級技巧匯總
阿新 • • 發佈:2017-12-30
標記 rgba 前端 blog z-index osi 字體 需要 pos
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高級技巧匯總