calc()
是一個 CSS 的函數,功能如 function 字面上的意思,在設定屬性的時候可以進行四則運算,不多說直接看各種 use case。
background-image: url(bottomRightCorner.png);
background-position: calc(100% - 50px) calc(100% - 20px);
max-height: calc(70vh - 57px - 42px);
.column-1-7 {
width: calc(100% / 7);
}
.column-2-7 {
width: calc(100% / 7 * 2);
}
.column-3-7 {
width: calc(100% / 7 * 3);
}
transform: rotate(calc(0.5turn + 45deg));
transition: calc(1s - 120ms);
calc()
A Couple of Use Cases for Calc()
A Complete Guide to calc() in CSS