Можно ли «убрать» стилизацию с элементов HTML?

Question

Мне интересно, возможно ли восстановить стиль элемента до состояния «по умолчанию», с помощью Javascript или иным образом.

Мне нужно сделать это, потому что я вставляю HTML в сторонние веб-страницы и не могу контролировать, какие стили они приписывают различным элементам. Например, они могут иметь:

div {
  margin: 10px;
  padding: 5px;
  line-height: 10px;
  font-size: 150%;
  border: 10px solid yellow;
  foo: bar;
}

Есть ли простой способ очистить все стили и вернуть их к настройкам по умолчанию? Есть ли даже список стилей по умолчанию?

Спасибо

Answer 1

Похоже, что кто-то уже задавал этот вопрос на SO.

Сброс CSS, стили по умолчанию для общих элементов

Answer 2

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

.reset {
  margin: 0 !important;
  color: #000 !important;
  ... etc ...
}

, а затем некоторые jQuery, такие как:

$('div').addClass('reset');

Может быть, будет работать ...

Answer 3

Если вы можете загрузить свой собственный CSS (или внутреннюю таблицу стилей), вы можете установить идентификатор элемента, и эти стили будут иметь приоритет над общими стилями div {}.

Answer 4

Стили по умолчанию определяются каждым браузером, и, как вы можете догадаться, во всех браузерах его стиль немного отличается. Вы можете определить каждый атрибут стиля и назначить его для наследования! Important:

div {
  margin: inherit !important;
  padding: inherit !important;
  line-height: inherit !important;
  font-size: inherit !important;
  border: inherit !important;
  foo: inherit !important;
}

Я не совсем уверен, что это сработает, поэтому я посмотрю вокруг и попробую.