Если после подключения Pure CSS страница выглядит как обычный нестилизованный HTML — без сетки, кнопок и оформленных форм — первым делом откройте инструменты разработчика (клавиша F12) и проверьте вкладку Network: файл pure-min.css либо не загружается вообще (статус 404), либо блокируется. Именно сбой на этапе загрузки — самая частая причина, по которой Pure «не работает».
Проблема почти всегда сводится к одному из четырёх сценариев: неверный путь к файлу, конфликт с другими стилями, отсутствие обязательных классов в разметке или устаревший кэш браузера. Ниже разберём каждый сценарий и порядок безопасной диагностики, который не требует изменения рабочего кода «вслепую».
Как устроен Pure и почему он «молчит»
Pure CSS — лёгкий модульный фреймворк от Yahoo, состоящий из отдельных модулей: base, grids, forms, buttons, tables, menus. Важная особенность: Pure не применяет оформление автоматически к обычным тегам. Кнопка станет стилизованной только если ей явно задан класс pure-button, форма — класс pure-form, а сетка работает через классы pure-g и pure-u-*.
Поэтому ситуация «Pure подключён, но ничего не изменилось» часто означает не поломку, а отсутствие нужных классов в HTML. Проверьте разметку: голый <button> без класса так и останется стандартной кнопкой браузера.
💡Pure — классовый фреймворк: стили применяются только к элементам с соответствующими классами. Подключения файла самого по себе недостаточно.