Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

round() - Fonction CSS

round()

Résumé des caractéristiques de la fonction round()

Description rapide
Calcule l'arrondi d'un nombre.
Statut
Standard
Module W3C
Module CSS - Valeurs et unités
Références (W3C)
Statut du document:: WD (document de travail)

Description de la fonction round().

La fonction round(v, g) arrondit le nombre v au multiple de g le plus proche. Un paramètre supplémentaire optionnel précise comment doit se faire l'arrondi.

Sans trop entrer dans les détails (qui sont décrits plus bas), voici quelques exemples :
    round(44,10) renvoie 40.
    round(87,100) renvoie 100.

Voyez aussi les fonctions mod() et rem() qui effectuent des calculs similaires.

La fonction round() peut être utilisée avec les propriétés suivantes :

En principe, les fonctions de calcul comme round() doivent pouvoir être utilisées à la place de n'importe quelle valeur numérique affectée à une propriété, dans la mesure où les types sont en accord. Par exemple si une propriété attend une dimension, il faut que la fonction renvoie une dimension.

Syntaxe de la fonction round().

v est la valeur à arrondir.
g est la granularité de l'arrondi.

round(
Schéma syntaxique de la fonction de calcul round() en CSSSyntaxe de la fonction de calcul round() pour arrondir les nombres. nearest nearest up up down down to-zero to-zero v, g v, g
)
  • <propriété>: round(10%, 20px); v g <propriété>: round(nearest, 10%, 20px); s v g

    Lorsqu'il est présent, le premier paramètre s indique la stratégie d'arrondi. Dans cet exemple, l'arrondi sera fait au plus proche. Si ce paramètre est omis, c'est la valeur nearest qui est par défaut.
    Les deux autres paramètres v et g peuvent être des nombres sans unité, ou avec une unité. Dans ce cas, les deux unités ne seront pas forcément les mêmes mais doivent représenter des grandeurs physiques de même nature. Par exemple, si le premier paramètre est en pixels, le deuxième pourra être en centimètres, mais pas en degrés.

    Dans cet exemple, l'arrondi se fait au plus proche. Supposons que la valeur en pourcentage se résolve en 114px, le multiple de 20px le plus proche est 120px.

  • <propriété>: round(up, 10%, 20px); s v g

    Ici le mot up spécifie un arrondi au dessus. Si les 10% se résolvent en 101 pixels, la fonction retournera 120px (premier multiple de 20 supérieur à 101).

  • <propriété>: round(down, 10%, 20px); s v g

    Le mot down spécifie un arrondi en dessous. Si le premier paramètre en pourcentages donne 99 pixels, l'arrondi au dessous sera 80 pixels.

  • <propriété>: round(to-zero, 10%, 20px); s v g

    La stratégie d'arrondi to-zero compare les valeurs qui auraient été obtenues avec up et avec down et choisit celle qui est la plus proche de zéro, en valeur absolue.

Simulateur.

La fonction round() est appliquée à la largeur de l'élément bleu ci-dessous. Vous pouvez faire varier les valeurs des pourcentages en changeant la taille de la fenêtre du navigateur (sur un PC de bureau).

width :
Résultat

Prise en charge des fonctions mathématiques par les navigateurs.

A part chez Firefox   et Safari  , la fonction round() n'est pas prise en charge par les navigateurs à l'heure actuelle (2024).

1
round()
Estimation de la prise en charge en pourcentage du parc actuel.
20%

Navigateurs sur ordinateurs :

Navigateurs sur mobiles :

Navigateurs obsolètes ou marginaux :

Androïd Brower

Chrome

Chrome pour Androïd

Edge

Firefox

Firefox pour Androïd

Internet Explorer

Opéra

Opéra Mobile

Safari

Safari sur IOS

Samsung Internet

Voir aussi, dans le même module de standardisation que round().

Les spécifications CSS éditées par le W3C sont organisées en modules. round() fait partie du Module CSS - Valeurs et unités (CSS Values and Units Module). Les définitions suivantes sont également décrites dans ce même module.

Fonctions.

Calcule la valeur absolue d'un nombre.
Calcule l'angle dont le cosinus vaut la valeur indiquée.
Calcule l'angle dont le sinus vaut la valeur indiquée.
Calcule l'angle dont la tangente vaut la valeur indiquée.
Calcule l'angle entre l'axe des abscisses et la droite reliant le point origine au point indiqué.
Renvoie la valeur d'un attribut.
Calcule une valeur pour une propriété.
Calcule une valeur entre deux valeurs extrêmes.
Calcul le cosinus d'un angle.
Calcule l'exponentielle d'un nombre.
Calcule la racine carrée d'une somme de carrés de nombres.
Calcule le logarithme d'un nombre.
Détermine la valeur la plus petite parmi une série de valeurs.
Détermine la valeur la plus grande parmi une série de valeurs.
Calcule le reste de la division entière entre deux nombres.
Calcule une mise à l'exposant
Calcule le reste de la division entière de deux nombres.
Calcule le signe d'un nombre.
Calcule le sinus d'un angle.
Calcule la racine carrée d'un nombre.
Calcule la tangente d'un angle.
Spécifie l'adresse d'un élément tel qu'une image par exemple.