При работе с CSS часто возникают ситуации, когда вам необходимо сбросить стили до значений по умолчанию. В этой статье представлены различные способы сброса CSS к значениям по умолчанию, а также примеры кода. Если вы хотите сбросить определенный элемент или всю страницу, это руководство поможет вам.

Метод 1: использование универсального селектора
Универсальный селектор (*) нацелен на все элементы на странице. Установив его свойствам значения по умолчанию, вы можете сбросить CSS для всего документа.

* {
  all: unset;
}

Метод 2: использование библиотеки сброса CSS
Библиотеки сброса CSS, такие как Normalize.css и Reset CSS, предоставляют предварительно определенные стили, которые сбрасывают CSS в разных браузерах. Просто включите библиотеку в свой проект, чтобы сбросить стили.

Метод 3: сброс определенных элементов
Чтобы сбросить определенные элементы, вы можете настроить их индивидуально, используя их селекторы элементов, и установить для их свойств значения по умолчанию.

/* Resetting an anchor tag */
a {
  all: unset;
}
/* Resetting a div */
div {
  all: unset;
}

Метод 4: использование значения revert
Значение revertсбрасывает значение свойства до его унаследованного значения или значения по умолчанию браузера. Это особенно полезно, если вы хотите сбросить определенное свойство элемента.

/* Resetting text color to default */
p {
  color: revert;
}

Метод 5: переопределение стилей с помощью initial
Значение initialустанавливает для свойства исходное значение по умолчанию. Вы можете использовать это, чтобы переопределить стили и вернуть их в состояние по умолчанию.

/* Resetting font size to default */
h1 {
  font-size: initial;
}

Метод 6: встроенные стили.
Если вы имеете дело со встроенными стилями, вы можете просто удалить или изменить атрибут стиля, чтобы вернуть элементу стили по умолчанию.

<p >This text will be reset to default color.</p>

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