vertical-align實現垂直居中的方法
1 img新增個同級元素span而且在一行，不在一行的話給父級加上white-space:nowrap 去掉換行識別
2.給span加上高度與父級同高度
3 轉換為display：inline-block
4新增vertical-align
5再給img新增vertical-align
6給父親新增text-align：center
通過定位position
給元素設定
position：absolute；
給容器設定position：relative；
1top:0; bottom:0; left:0 right:0 ； margin：auto；
2 top：50%; left:50; 通過margin 或者translate 位移 向上向左移動自身的一半值
推薦translate 屬性）
容器一般都是被子元素撐開的設定margin 會影響內部的元素或者會有margin-top傳遞給父級
通過設定行高的方法（不推薦）
給容器新增 text-align：center 屬性 水平居中
然後設定 跟容器同高的 line-height 屬性
切記 text-align 使 行內元素居中， 行內塊元素居中
彈性盒布局居中方法
將容器轉換為彈性盒布局 display：flex；
給容器新增 justify-content：center； 水平方向居中
align-items：cneter； 垂直方向居中；
讓子元素在父元素中水平居中垂直居中的方法
方法1 寫乙個偽元素，將它設定為行內塊元素，高度與父元素相同，寫一條屬性，vertical align middle,子元素也要寫，具體 如下 div.zi div after style head son div div 方法2 利用定位，給大的div寫乙個position relative 子元...
幾種可以讓元素水平垂直居中的方法
1.負margin法 這是比較常用的方法，在知道元素的寬高的前提下才能使用 a 注 負margin是個非常有意思的用法，深入了解後會發現他在布局上相當有用。優點 量少，相容性好。缺點 非響應式方法，內容可能會超出容器。2.transform法 a 優點 量少 寬高可變，相應式布局 缺點 不支援ie8...
如何讓元素在父元素中水平或垂直居中
行內元素 text align center line height height 塊級元素 1.給父元素設定display flex 並且設定 align items centerjustify content center 2.給父元素乙個定位屬性，子元素使用絕對定位，並且使用配合屬性left ...