Round() - Fonction CSS
Résumé des caractéristiques de la fonction round()
Schéma syntaxique de round().
round()Les liens du schéma donnent accès à plus de détails
Signification des termes présents sur le schéma :
numberest la valeur à arrondir.integerest la granularité de l'arrondi.
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().
- <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
sindique la stratégie d'arrondi. Dans cet exemple, l'arrondi sera fait au plus proche. Si ce paramètre est omis, c'est la valeurnearestqui est par défaut.
Les deux autres paramètresvetgpeuvent ê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 de20pxle plus proche est120px. - <propriété>: round(up, 10%, 20px); s v g
Ici le mot
upspécifie un arrondi au dessus. Si les10%se résolvent en 101 pixels, la fonction retournera120px(premier multiple de 20 supérieur à 101). - <propriété>: round(down, 10%, 20px); s v g
Le mot
downspé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-zerocompare les valeurs qui auraient été obtenues avecupet avecdownet 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).
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).
round()Navigateurs sur ordinateurs :
Navigateurs sur mobiles :
Navigateurs obsolètes ou marginaux :
Androïd Brower
Baidu Browser
Chrome
Chrome pour Androïd
Edge
Firefox
Firefox pour Androïd
Internet Explorer
KaiOS Browser
Opéra
Opéra Mobile
QQ Browser
Safari
Safari sur IOS
Samsung Internet
UC Browser pour Androïd
Opéra mini
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.