css calc使用總結

神奇大叔發表於2020-11-23
加減等運算子前後必須加空格

表現負數:
	方式一:calc(-1 * 25px - -1 * 5px);  使用-1 * 來實現
	方式二:calc(0px - (25px + 5px)));   使用0px - 來實現

calc中帶變數:使用方式相同
	calc(-1 * var(--circleWidth) - -1 * var(--gap));
    calc(0px - (var(--circleWidth) + var(--gap)));

程式碼示例:

.jf-switch-checked{
    left: 100%;
    margin-left: calc(-1 * var(--circleWidth) + -1 * var(--gap));
    /* calc(0px - (var(--circleWidth) + var(--gap))) */
}