absolute定位css元素居中的兩種方法

冷子夜發表於2020-11-27
原文網址 : https://blog.csdn.net/qq_29180565/article/details/110238665
CSS

1（上下左右居中，不能微調）

position:absolute;

left:0; right:0; top:0; bottom:0;

margin:auto;

2（上下左右居中，可微調）

position:absolute;
top:50%; left:50%;
margin-top:-100px;(元素高度的一半)
margin-left:-100px;(元素寬度的一半)

3 橫向居中

position:absolute;
left:calc(50% - 元素寬度一半);

相關文章