1. 定位 --- top 50% left 50%
(1) 知道寬高的情況下margin-left margin-top 給個 ( -1/2 寬高 )
(2) 不知道的請況 translate(-50%,-50%)
2. flex --- display:flex;
(1) 水平方向 justify-content：center
(2) 垂直方向 align-items: center
3. table-cell
(1) 父級元素display:table-cell;
(2) 垂直 vertical-align: middle;
(3) 水平 text-align: center;
(3) 內部子元素 display：inline-block;
4. 子元素絕對定位 top left right bottom 設定為 0 margin:auto;
實現垂直水平居中的方法
因為這一型別題目我面試的時候被問了很多遍，然後就想總結一下吧。大概分了幾類。html 如下 id parent id child div div 其樣式 container child第一類 不知道父元素的寬高和子元素的寬高 利用絕對定位 其百分比是相對于父元素而言 和transform的trans...
實現水平居中和垂直居中的方法
一 水平居中 1.text align center 行內元素 給其父元素設定屬性 text align center 2.margin 0 auto 塊級元素 給元素本身設定 margin 0 auto 3.元素的寬度固定 ele 4.元素的寬度不固定 ele 二 垂直居中 1.line heig...
css實現水平居中 垂直居中 垂直水平居中布局
1.只需要把行內元素包裹在乙個屬性display為block的父層元素中，並為父層元素新增如下屬性即可 parent2.塊狀元素解決方案 item3.多個塊狀元素解決方案將元素的display屬性設定為inline block，並且把父元素的text align屬性設定為center即可 paren...