От автора: когда я объявил, что собираюсь написать что-то для разработчиков JavaScript, которые не понимают CSS, многие люди (в том числе Джереми) сказали, что глава Каскады и наследование будет иметь решающее значение, так как многие разработчики JS, похоже, не понимают этого.
Сначала я согласился, но позже у меня возникли некоторые сомнения, и именно по этой причине я пишу эту заметку. Насколько я вижу, проблема заключается не в том, что разработчики JavaScript не понимают CSS каскад, проблема в том, что они не хотят его использовать. Но действительно ли это проблема?
Глобальная область
CSS имеет только глобальный охват. Правило button.primary влияет на все кнопки этого класса на всей странице. В этом сила каскада. В ходе работы над недавним проектом я провел полчаса с дизайнером, определяя основной, вторичный и третичный класс кнопок / ссылок. Это было с пользой потраченное время: мы оба смогли ввести кнопки в код, и с того времени их стили начали работать.
Однако разработчики привыкли не доверять глобальной области видимости. Хотя в JavaScript это имеет смысл, это гораздо меньше касается CSS, поскольку часть силы CSS — это именно ее глобальная область, реализуемая через каскад. Поэтому JavaScript-разработчикам не нравится CSS; см., например, CSS: плохие биты, где много нареканий на глобальный охват. Но разве пользователи JavaScript не видят преимущества каскада CSS? Разве они не игнорируют часть того, что делает CSS настолько мощным?
Локальная область
Ну, и да, и нет. Чтобы вернуться к моему предыдущему примеру, он имеет смысл на относительно простом сайте, таком как тот, что мы делали. Это имеет меньше смысла, если вы хотите вводить не одну кнопку, а целый компонент, который может включать в себя кнопку, но нужно, чтобы стиль кнопки соответствовал стилю компонента. В этом случае вам нужно обеспечить, чтобы общие стили не влияли на кнопку компонента. Вам нужно, чтобы CSS имел локальный охват.
Эти случаи не являются чем-то исключительным, и я не сомневаюсь, что мои читатели поняли это сами и нашли замечательные варианты использования как глобальных, так и локальных стилей в зависимости от потребностей проекта. Как сказал Чарли Оуэн: «Я слышал, что люди находят область действия и каскад несовместимыми. Но использование каскада просто означает (для меня) использование глобальных аспектов CSS. Установите по умолчанию для уровня блока поля, типографику и т. д. После этого для каждого компонента все остальное можно будет задавать отдельно».
Все нормально. Это, насколько я вижу, является правильным решением проблемы.
В чем проблема?
Но что мне делать с жалобами разработчиков JavaScript, которые не понимают каскад? Я думаю, они прекрасно понимают его; они просто решили не использовать. Поэтому я не думаю, что здесь действительно есть проблема. Тем не менее, я решил написать эту заметку и задать этот вопрос, потому что я мог кое-что упустить.
Итак, в чем проблема разработчиков JavaScript и каскадов, с использованием глобальных стилей, поскольку эти разработчики делают все локальным? Может мне кто-нибудь объяснить это? Благодарю за внимание.
Автор: Peter-Paul Koch
Источник: https://www.quirksmode.org/
Редакция: Команда webformyself.