Есть ли способ "изолировать" блок HTML от страницы CSS без использования iframe?

Ответ 1

Нет, это (к сожалению) невозможно без iframe.

Вам понадобится reset каждое существующее правило CSS для этого div так:

div.sandbox
 {
    font-size: ....
    font-family: ..........
    margin: .........
    padding: .........
    line-height: .........
  }

в то время как трудно и никогда не на 100% надежнее, возможно, таким образом можно достичь полезного результата. Вы можете посмотреть один из "reset stylesheets", например Eric Meyer, чтобы получить список важных свойств reset; здесь - это то, что претендует на полный список свойств CSS 2.1 - исключая CSS 3 и специфические для поставщика, которые вы должны были бы принять во внимание как хорошо.

Провайдеры сторонних виджетов часто жестко кодируют свой "reset CSS" как встроенный CSS внутри HTML-элемента, чтобы переопределить любые правила !important, которые угрожают переопределить правила класса песочницы.

Ответ 2

Может давать результаты:

div {
 all:unset !important;
 clear:both !important;
 margin: 0 !important
}

Встроенный стиль будет переопределять любые стили css. Это также означает, что любые стили, заданные javascript, будут переопределять любые правила CSS, только потому, что javascript устанавливает стили встроенным образом.

Также любые стили между тегом стиля непосредственно в html-части будут переопределять стили, установленные в файле css. В любом случае стиль inlines управляет любыми другими иерархически.