时间戳

首页 > 解决方案 > HTML - 使用内部 CSS

jquery - HTML - 使用内部 CSS

问题描述

我正在使用 JQuery 加载使用 CSS 加载第三方 HTML。这是作为页面的一部分加载到 div 中。我想：

JS

$('#load-html').load('ThirdPartyHTMLURL');

HTML

<html>
    <head>
        <link rel="stylesheet" href="styles.css">
    </head>
    <div>Hi</div>
    <div id="load-html"></div>
</html>

我怎样才能做到这一点？

标签： jqueryhtmlcss

解决方案

外部 CSS 不适用于加载的 HTML

适用于文档的 CSS 适用于整个文档。

如果您向当前文档添加更多 HTML，则文档的样式表将应用于它。

加载的 CSS 仅适用于内部 HTML，不适用于外部

有一项关于允许这样做的功能的提案，但在任何实际意义上都不受支持。

所以有两种方法可以实现这一点：

  • 仔细编写您的 CSS，以便其中的规则仅适用于您希望它应用的元素
  • 不要将两组 HTML 放在同一个文档中（例如使用 iframe）

推荐阅读