CSS： calc()

數值運算

calc():像是 數學運算式，屬性設定是數值的時候就可以利用加減乘除的來做運算！

例如： <length> 長度、<time> 時間、<frequency> 頻率、<angle> 角度、<number> 數字或者是 <integer> 整數這幾個屬性值都可以使用 calc()。

/* 屬性: calc(運算式) */
width:calc(100%-30px);

語法

設定 width and height時，<length> 相關的屬性時， 在不同單位間也可以進行運算，按照先乘除後加減進行計算。

• +：加
• -：減
• *：乘。其中一個運算參數必須是數字 (number)
• /：除。除數必須是數字，除數不可為零，會造成 HTML 解析錯誤。

參考網址：https://5xruby.tw/posts/css-calc/