居中元素定寬高
1. absolute + 負margin
2. absolute + margin auto
3. absolute + salc
居中元素不定寬高
1. absolute + transform
2. text-align + vertical-align
3. writing-mode:
4. table
5. css-table
6. flex
7. grid
// absolute + 負margin
parent
son px;
margin-top: -px;
}複製**
// absolute + margin auto
parent
son
複製**
// absolute + calc
parent
son px);
top: calc(50% - px);
}複製**
// position + transform
parent
son ;複製**
// textalign+ lineheight(行內元素給父元素設定text-align可以達到水平居中)
parent px;
}son px;
}複製**
// textalign + verticalalign(lineheight+vertical垂直居中，display+textalign水平居中)
parent px;
}son 複製**
// flex
parent 複製**
// grid
parent
son 複製**
元素水平垂直居中
lang en charset utf 8 垂直居中示例title name viewport content width device width,initial scale 1 rel stylesheet href 可行，支援ie8 block1 block1 before center1 不...
元素水平垂直居中
給子元素設定以下內容 給父元素新增屬性 display flex align items center justify content center 先給元素設定絕對定位，再依次新增以下屬性，具體 如下所示。position absolute top 0 left 0 right 0 bottom ...
元素水平垂直居中
只可用於定寬高元素 doctype html html lang en head meta charset utf 8 title 垂直居中 title style type text css body parent container style head body div id parent d...