Я использую Javascript для вставки некоторого стилизованного HTML-кода в другую веб-страницу (которая была просканирована), и я пытаюсь сделать это таким образом, чтобы минимизировать любые конфликты со стилями CSS целевой страницы. Я внедряю фиксированную позицию <div>, которая плавно перемещается вверх по целевой странице.
Пока что подход, который я выбрал, заключается в создании уникального идентификатора CSS (своего рода пространства имен), который сначала сбрасывает все мыслимые стили, а затем применяет свои собственные стили:
/* reset */
#my-div {display: block; visibility: visible; margin: 0; padding: 0; ... etc}
/* my styles */
#my-div {margin: 10px 5px; ... etc}
Тем не менее, <div> содержит текст, ссылки, изображения, поэтому я был бы вынужден сделать это для всего, что внутри него, и генерировать много CSS-кода. Это потому, что собственные стили целевой страницы будут проходить иначе и влиять на мой внедренный HTML.
Я могу сделать это ... но мне интересно, если кто-нибудь знает о более умном / более простом способе защиты моего HTML / CSS от кода целевой страницы.
Заранее спасибо за любые идеи.