PassFront
  1. PassFront
  2. База знаний
  3. Основы CSS

Чем отличаются виды CSS Reset и где они применяются?

Основы CSS

CSS Reset бывает жёстким (обнулить всё), нормализующим (выровнять браузеры) и современным минимальным.

Жёсткий reset (Eric Meyer)

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

Normalize.css

Сохраняет полезные стандартные стили, но исправляет различия браузеров. Подходит для контентных сайтов, где базовая типографика устраивает.

Современный минимальный reset

Небольшой набор правил по здравому смыслу:

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
body { line-height: 1.5; -webkit-font-smoothing: antialiased; }
img, picture, video, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3 { overflow-wrap: break-word; }

Самый распространённый вариант сейчас — часто встроен в фреймворки (Tailwind Preflight).

Коротко для собеседования

Жёсткий reset обнуляет всё, Normalize выравнивает браузеры, современный reset — минимальный набор полезных правил; выбор зависит от того, нужен ли стандартный вид элементов.

Подробнее: Josh Comeau — A Modern CSS Reset

Другие вопросы раздела