文章出處
文章列表
很多時候我們需要把一個元素在其父級容器里水平、垂直居中對齊。以下我列出了常用的幾種方法：
1、在知道子元素寬度與高度的情況下進行居中，采用位置定位：absolute + margin
.parent { position: relative;}
.child { position: absolute; width: 100px; height: 60px; top: 50%; left: 50%; margin: -30px 0 0 -50px;}
2、在不知道子元素高與寬的情況下，采用位置定位：absolute + transform
.parent { position: relative;}
.child { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
3、采用 flexbox 進行居中對齊
.parent { display: flex; justify-content: center; align-items: center;}
.child { }
選擇某范圍內的子元素
轉自http://ask.aseoe.com/question/54
文章列表
全站熱搜
留言列表
