Ответ 1
К сожалению, в CSS нет такой вещи, как переменная PI.
Однако..
Вы можете использовать CSS-переменные для присвоения ему номера, недостатком этого является то, что он имеет действительно, очень плохую поддержку браузера.
Это будет работать так:
:root {
--PI: 3.14159265358979; // enter the amount of digits you wish to use
}
.circle {
width: calc(100 * var(--PI));
}
Лучшим решением было бы использовать препроцессор, такой как SASS или Less, для присвоения переменной PI, это будет выглядеть следующим образом в SASS:
$pi: 3.14159265358979 // amount of digits you wish to use
.circle {
width: calc(100 * ${pi});
}
ОБНОВЛЕНИЕ: как упоминалось в комментариях, некоторые браузеры (Safari + IE) округляют до 2 десятичных знаков, где Chrome и Firefox могут округлять до (как минимум) 4 десятичных знаков.