Минимальный файл сброса стилей minireset.css

Минимальный файл сброса стилей minireset.css

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

Тернистый путь

Существует много вариантов, версий normalize.css, reset.css, у каждой есть свои достоинства и недостатки. Приходится вносить правки иногда, переопределять уже существующие стили. К тому же, многие решения довольно тяжёлые, ведь зачем всё приводить к нормализованному виду, чтобы затем переопределять многие из свойств?

До того, как я обнаружил для себя reset.css, приходилось каждый раз указывать своё значение margin, padding и box-sizing, сбрасывать значение list-style для немаркированных списков, потому как при первоначальной вёрстке они чаще всего используются для построения многоуровневых меню, иногда и сами списки перестилизуются.

Чтобы всего этого избежать, можно воспользоваться минимальным файлом сброса стилей.

Легковесное решение

Можно пойти по пути минимализма и сбросить только основные свойства, которые чаще всего требуют сброса. Раньше делал так:


* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

И этого было вполне достаточно. Но позже я понял, что так делать не стоит. Селектор так себе, заголовки страдают и ещё кое-какие грабли появляются от такой простоты.

Позже нашёл простое современное решение — минимальный и в то же время более полноценный вариант сброса стилей minireset.css

В итоге когда начинаю проект, мне хватает только minireset.css для сброса основных стилей и дальше уже приятно вести разработку. Конечно иногда возникает желание дописать что-то в исходник minireset.css, но пока это не дорастает до pull request.



Я фронтенд разработчик, веду блог о вёрстке сайтов, оптимизации веб-приложений. Улучшаю пользовательский опыт, собираю лучшие практики в области веб-разработки.

Чтобы не пропускать новости, можно подписаться на email рассылку.