Зачем нужен CSS reset и как работает normalize.css?

Question

Accepted Answer

## Зачем вообще reset

Браузеры дают элементам разные отступы, размеры шрифтов, стили списков и форм. Reset/normalize снимают эту «лотерею» и дают предсказуемую базу.

## Reset vs Normalize

- **Reset** (например Eric Meyer) обнуляет почти всё: `margin`/`padding`/`border` у многих тегов → дальше вы сами задаёте шкалу.
- **Normalize.css** не обнуляет, а **выравнивает** поведение: делает HTML5-элементы блочными где нужно, чинит баги форм/типографики, сохраняет полезные дефолты.

```css
/* идея reset */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }

/* normalize скорее точечно */
h1 { font-size: 2em; margin: 0.67em 0; }
```

## Практика

Часто берут лёгкий modern reset (`box-sizing`, `margin: 0` у body, `img { max-width: 100% }`) плюс свои токены. Полный Meyer-reset без системы отступов даёт «голую» страницу и дублирование стилей.

## Итог

Reset — чистый лист; normalize — согласованные дефолты между браузерами. На собеседовании важно назвать разницу и сказать, что вы выбираете осознанно под дизайн-систему.