Является ли CSS языком программирования?
Тьюринг-полным — нет. Но CSS — де-факто — это декларативный язык описания интерфейсов, и развитие его идёт в этом направлении довольно чётко.
Впрочем, fizzbuzz на CSS решается даже слишком элегантно: https://codepen.io/SachaG/pen/nwazRo
Так вот, к чему это я. Вы вообще в курсе, что в CSS есть типы? А они есть. И на их основе можно реализовать некоторые математические функции.
Тригонометрические вон завезли недавно, а математические пока только в Safari.
Давайте попробуем исправить это недоразумение и реализуем
abs, floor, round, ceil, mod и rem на CSS и его типах. Начнём с модуля:--abs: max(var(--a), -1*var(--a));
Поняли, что тут произошло? Выбрали максимальное между a и -a. Очевидно, что положительное всегда будет максимальным, его и берём.
Теперь к сути дела. Давайте реализуем
round:@property --round {
syntax: '<integer>';
initial-value: 0;
inherits: false;
}--round: var(--a);Вот щас может стать немножечко больно: мы объявили переменную (custom property, для зануд)
--round и указали CSS, что её тип — целое число. Теперь браузер возьмёт и... и округлит значение математически при присваивании (опять для зануд: да, это де-факто присваивание). А как сделать
floor — округление вниз? Как-как:--floor: calc(var(--a) - .5);А
ceil — округление вверх? --ceil: calc(var(--a) + .5);Естественно, перед этим надо объявить переменные
--floor и --ceil как целые числа.Кажется, уже стало немного больно, поэтому получение знака числа и двух разных остатков по делению реализуем потом.
Пока можете подумать, где это применить 😉
#css #types #бородач
