方法一:
絕對定位方法：不確定當前div的寬度和高度，採用 transform: translate(-50%,-50%); 當前div的父級新增相對定位（position: relative;）
**如下：
div方法二:
絕對定位方法：確定了當前div的寬度，margin值為當前div寬度一半的負值
**如下：
div方法三：
絕對定位方法：絕對定位下top left right bottom 都設定0
**如下：
我是子級
div.child方法四:
flex布局方法：當前div的父級新增flex css樣式
child
.box
div.child
方法五:
table-cell實現水平垂直居中: table-cell middle center組合使用
**如下：我愛你
.table-cell方法六:
絕對定位：calc() 函式動態計算實現水平垂直居中
calc
.calc
.calc .child
div絕對居中的六種方法
在平時，我們經常會碰到讓乙個div框針對某個模組上下左右都居中 水平垂直居中 其實針對這種情況，我們有多種方法實現。方法一 絕對定位方法 不確定當前div的寬度和高度，採用 transform translate 50 50 當前div的父級新增相對定位 position relative div方...
div水平居中及div水平垂直居中的方法總結
1 margin auto wrap wrap txt2 text align center 3 absolute margin偏移 wrap wrap txt4 display box 文字 box pack5 absolute transform 1 line height 文字 wrap tx...
居中的六種方法
居中效果在css中很是普通的效果，平時大家所看到的居中效果主要分為三大類 水平居中 垂直居中和水平垂直居中。而其中水平居中相對於後兩者來說要簡單得多。早期總結了一下網際網路上有關於水平垂直居中的幾種實現方案，比如說 css製作水平垂直居中對齊 中介紹了八中實現水平垂直的方案，而在 css製作水平垂直...