Обновить

Комментарии 13

Скорее вопрос не в не знании каких-то фишечек, а в том, что по сравнению с бэкендом, фронтенд многогранен и прекрасен. Можно всю карьеру делать сложные проекты, но так ни разу и не сверстать попам, т.к. всегда есть какая-то дска по рукой

Каким таким попам ты собрался верстать? 😁

Да знаю, что опечатка, но весело же 😁

К сожалению, последствия общения с фронтендерами начинают сказываться все сильнее и сильнее...

Я не понял про legacy слой? Нафига? Сохранить стиль на всякий пожарный что ли? Я понимаю когда это используется в фреймворках: вот вам набор стилей, можете перезаписать. Да поменяйте стиль, делов то. Переписать обратно быстрее, чем искать, а есть ли у нас легаси для этого правила. Вод для кода я бы понял.

Суть в том, что можно все старые стили обернуть в legacy слой, вдруг они используются в остальном проекте, а в новой фиче нужно её изменить.
Впоследствии можно переопределять значения либо вне слоя, либо в более вышестоящем слое. Это намного удобнее, чем городить огромный селектор (а он может быть действительно большим). Плюс для библиотек просто незаменимая вещь, там часто можно встретить огромные селекторы с кучей предикатов, разбираться в которых нет никакого желания. В лучшем случае всё сделано через css переменные, но это не всегда так, поэтому фича очень полезная

Суть в том, что можно все старые стили обернуть в legacy слой

И нужно каждый такой конфликтующий селектор со стилем скопировать в этот слой, чтобы его успешно переопределить в более приоритетном слое либо вне слоев?

В статьях с нововведениями веба часто не хватает ссылок на caniuse, чтобы можно было сразу прикинуть, фишку стоит изучить или уже использовать в проектах.

Вот список, если кому-то тоже интересно, но лень искать.

https://caniuse.com/mdn-api_htmlelement_popover

https://caniuse.com/mdn-css_at-rules_starting-style

https://caniuse.com/mdn-css_properties_transition-behavior

https://caniuse.com/css-cascade-layers

https://caniuse.com/mdn-css_types_round

https://caniuse.com/css-media-range-syntax

Спасибо, обалдеть, поповер production ready, не прошло и 30 лет как мы их городим на Js... ой погодите, а ведь прошло)

margin: round(to-zero, 1.25rem, 1px);

А это точно будет один раз посчитано? Или штук 100 таких объявлений на странице будет давать рандомные микрофризы при попытках пересчитать?

Спасибо за нормальное объяснение про @layer.

У первого объявленного слоя наименьший приоритет, а у последнего — наибольший.

До тех пор, пока вы не используете !important — там приоритеты ровно наоборот.

Стоило ещё упомянуть, что правила вне слоёв являются как бы самым последним слоем.

Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Информация

Сайт
ruvds.com
Дата регистрации
Дата основания
Численность
11–30 человек
Местоположение
Россия
Представитель
ruvds