Мне дана внешняя таблица стилей (.css-файл), которая не может быть изменена каким-либо образом. Однако мне нужно применить эту таблицу стилей к одному div и, следовательно, к содержимому div на моей уже существующей веб-странице. В настоящее время я читаю содержимое таблицы стилей как текст в пустой тег стиля (используя .innerHTML) в div, который мне нужно затронуть, но это все равно затрагивает всю веб-страницу, а не только один div. Может кто-нибудь помочь с этим?Div с внешней таблицей стилей?
ответ
IFRAME работает следующим образом:
В вашей основной HTML файл, вы будете иметь свой DIV:
<div id="myspecialdiv">
<iframe width="100%" height="100%" frameborder="0" src="divcontent.html"></iframe>
</div>
стиль, который, как вам нужно. Файл divcontent.html должен быть полным HTML-файлом, в том числе содержания DIV тега и LINK с помощью внешних стилей:
<html>
<head>
<link rel="stylesheet" href="path/to/external/stylesheet.css" />
</head>
<body>
<!-- The contents of your DIV -->
</body>
</html>
говорят, что мне дано несколько внешних таблиц стилей. как я могу связать их все с divcontent.html во время выполнения? Я работаю над веб-приложением, которое постоянно получает новые .css-файлы. – LethalPapercut
Это зависит от вашей среды выполнения, языка, который вы используете для разработки веб-приложения, рамки, на которой оно основано, и архитектуры вашего приложения. Но нет требования, чтобы файл 'divcontent.html' фактически был HTML - это мог быть любой файл, который создает HTML (например: PHP, aspx и т. Д.). Ответ дает вам концепцию - вам придется адаптировать ее к вашим конкретным требованиям. –
Если вы можете работать с HTML5, вы можете попробовать использовать scoped styles. Вы можете включить CSS внутри DIV, имея это влияет только его родитель:
<div>
<style scoped>
// Styles here
</style>
</div>
Похоже на удивительное решение, но оно не соответствует моим потребностям, поскольку атрибут scoped не поддерживается ни в одном из основных браузеров. – LethalPapercut
Я хочу ссылаться на внешние файлы CSS, и, похоже, это невозможно сделать внутри тега
CSS влияет на всю страницу. Единственный способ, которым я знаю, изолировать это, так что он влияет только на определенную часть страницы - это использовать IFRAME. –
Итак, IFRAME внутри моего div? Я могу это сделать, но тогда как я могу повлиять только на IFRAME? – LethalPapercut