CSS mod() 函數

定義和用法

CSS 的 mod() 函數返回一個數（被除數）除以另一個數（除數）后剩余的模數。

舉例：mod(9, 2) = 1。（9 / 2 = 4; 4*2 = 8, 余數 =1）

舉例：mod(9, -2) = 1。（9 / -2 = 4; 4*-2 = -8, 余數 =-1）

解釋：9 / -2 = -4.5，但取整為 -4；-4 * -2 = 8，由于取整方向，實際計算中視為 9 - 8 = 1，或根據余數定義直接得 -1 的相反數 1，注意結果符號與除數相同。實際計算中，mod 的處理可能因實現而異，但通常遵循數學上的取余規則，并考慮除數的符號。

注意：結果始終采用除數的符號。

實例

一些 mod() 的例子：

line-height: mod(9, 2); /* 1 */
line-height: mod(19, 4); /* 3 */
line-height: mod(3.5, 3); /* 0.5 */
padding: mod(9%, 2%); /* 1% */
padding: mod(19px, 4px); /* 3px */
padding: mod(19rem, 4rem); /* 3rem */
rotate: mod(120deg, 25deg); /* 20deg */
rotate: mod(120deg, -25deg); /* -20deg */
rotate: mod(-90deg, 15deg); /* 5deg */
rotate: mod(-90deg, -15deg); /* -5deg */

CSS 語法

mod(dividend, divisor)

技術細節

瀏覽器支持

表格中的數字表示首個完全支持該函數的瀏覽器版本。

相關頁面

參考：CSS acos() 函數

參考：CSS asin() 函數

參考：CSS atan() 函數

參考：CSS atan2() 函數

參考：CSS calc() 函數

參考：CSS cos() 函數

參考：CSS exp() 函數

參考：CSS hypot() 函數

參考：CSS log() 函數

參考：CSS pow() 函數

參考：CSS sin() 函數

參考：CSS sqrt() 函數

參考：CSS tan() 函數