色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css定位上下居中顯示

盧春練1年前6瀏覽0評論

CSS定位常用的屬性有position、top、left、bottom、right。其中使用position屬性定義元素的定位類型:

position: relative; // 相對定位,相對于自身原始位置移動
position: absolute; // 絕對定位,相對于其最近的非static父級元素定位
position: fixed;    // 固定定位,相對于視口(瀏覽器窗口)定位

實現上下居中對齊,需要使用絕對定位,配合top和transform屬性,代碼如下:

.parent {
position: relative;
}
.child {
position: absolute;
top: 50%;
transform: translateY(-50%);
}

其中,.parent為父元素,需設置為position: relative;以便讓子元素.child相對于父元素絕對定位。.child為子元素,top: 50%;將子元素上移至父元素中央線,transform: translateY(-50%);再將子元素向上平移自身高度的一半,即可實現上下居中對齊。

需要注意的是,若子元素高度大于父元素,則無法居中對齊,需針對不同情況選擇其他解決方案。