Función mod() de CSS

Definición y uso

CSS de mod() La función devuelve el módulo restante de un número (dividendo) dividido por otro número (divisor).

Ejemplo: mod(9, 2) = 1. (9 / 2 = 4; 4 * 2 = 8, resto = 1)

Ejemplo: mod(9, -2) = 1. (9 / -2 = 4; 4 * -2 = -8, residuo = -1)

Explicación: 9 / -2 = -4.5, pero se redondea a -4; -4 * -2 = 8, debido a la dirección de redondeo, se considera 9 - 8 = 1 en el cálculo real, o se obtiene directamente el opuesto del número inverso -1 como 1, prestando atención al signo del resultado y del divisor. En el cálculo real, el manejo de mod puede variar según la implementación, pero generalmente sigue las reglas de la división residual matemática y considera el signo del divisor.

Nota:Los resultados siempre adoptan el signo del divisor.

ejemplos

Algunos mod() Ejemplos:

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 */

Sintaxis de CSS

mod(dividend, divisor)

Detalles técnicos

Compatibilidad del navegador

Los números en la tabla representan la versión del navegador que admite completamente la función por primera vez.

Páginas relacionadas

Referencia:Función acos() de CSS

Referencia:Función asin() de CSS

Referencia:Función atan() de CSS

Referencia:Función atan2() de CSS

Referencia:Función calc() de CSS

Referencia:Función cos() de CSS

Referencia:Función exp() de CSS

Referencia:Función hypot() de CSS

Referencia:Función log() de CSS

Referencia:Función pow() de CSS

Referencia:Función sin() de CSS

Referencia:Función sqrt() de CSS

Referencia:Función tan() de CSS