使用 calc()

calc() 函式是 CSS3 中新語法的一部分,你可以通過使用畫素,百分比等各種值來(數學地)計算元素佔用的大小/位置。注意: - 每當使用此函式時,始終照顧兩個值 calc(100% - 80px) 之間的空間。

CSS

.center {
    position: absolute;
    height: 50px;
    width: 50px;
    background: red;
    top: calc(50% - 50px / 2); /* height divided by 2*/
    left: calc(50% - 50px / 2); /* width divided by 2*/
}

HTML

<div class="center"></div>