css水平垂直居中(绝对定位居中)
生活随笔
收集整理的這篇文章主要介紹了
css水平垂直居中(绝对定位居中)
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
使用絕對(duì)定位有個(gè)限制就是父集必須設(shè)置一個(gè)固定的高度。
首先HTML
1 <div id="box"> 2 <div class="child"></div> 3 </div>CSS
1 #box { 2 position: relative; 3 height: 500px; 4 background: red; 5 } 6 .child { 7 width: 100px; 8 height: 100px; 9 background: blue; 10 margin: auto; 11 position: absolute; 12 top: 0; 13 right: 0; 14 bottom: 0; 15 left: 0; 16 }示例圖:
總結(jié)
以上是生活随笔為你收集整理的css水平垂直居中(绝对定位居中)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 巧用CSS实现分隔线
- 下一篇: 父类div高度适应子类div