The easy "HTML5" way would be:
简单的“HTML5”方式是:
<iframe srcdoc="<p>Hello world!</p>"></iframe>
Here's more info on that: http://www.w3schools.com/html5/att_iframe_srcdoc.asp
这里有更多的信息:http://www.w3schools.com/html5/att_iframe_srcdoc.asp
But this is not supported in any of the modern browsers. Any suggestions on an alternative way to make this work?
但这在任何现代浏览器中都不支持。对另一种方法有什么建议吗?
[edit] Sorry for lack of clarity. My goal is to open a 3rd party web site using its own css in a frame (or other element) of a page. I have my own css that governs my content, but I'd like to have the 3rd party site also rendered correctly with its own css and not have the 2 interfere with each other.
【编辑】对不起，不清楚。我的目标是在一个页面的框架(或其他元素)中使用自己的css打开一个第三方网站。我有我自己的css来管理我的内容，但是我希望第三方网站也能正确地使用它自己的css，而不是让两者互相干扰。
1 个解决方案
#1
3
If I understand you correctly, "isolating" would refer to restricting a subset of styles to only apply to some content on a given page.
如果我理解正确，“隔离”将指的是限制样式子集只适用于给定页面上的某些内容。
I would generally avoid using an iframe (or rather a more compliant <object>) unless that is the only way to integrate third-party content, even though it would in fact limit the applicable scope of any applied css.
我通常会避免使用iframe(或者更兼容的
Parent selectors would likely be appropriate for what you're trying to accomplish, acting effectively as a "pseudo-namespace" for your rules:
父选择器可能适合于您试图实现的目标，有效地充当您的规则的“伪命名空间”:
<p>Hello world!</p>
<p>Some great content here!</p>
<div id="isolated-content"><p>Hello world styled differently!</p></div>
and
和
p {color:black;}
#isolated-content p {color:red;}
Would only apply red color to the second "Hello world" paragraph.
将只应用红色到第二个“Hello world”段落。
Naturally, all normal css mechanics still applies (inheritance, cascading etc.) so you may have to override the rules accordingly. Unless you provide specific scenario details, this is the most details I can offer.
当然，所有普通的css机制仍然适用(继承、级联等)，因此您可能需要相应地重写规则。除非您提供特定的场景细节，否则这是我所能提供的最详细的细节。
#1
3
If I understand you correctly, "isolating" would refer to restricting a subset of styles to only apply to some content on a given page.
如果我理解正确，“隔离”将指的是限制样式子集只适用于给定页面上的某些内容。
I would generally avoid using an iframe (or rather a more compliant <object>) unless that is the only way to integrate third-party content, even though it would in fact limit the applicable scope of any applied css.
我通常会避免使用iframe(或者更兼容的
Parent selectors would likely be appropriate for what you're trying to accomplish, acting effectively as a "pseudo-namespace" for your rules:
父选择器可能适合于您试图实现的目标，有效地充当您的规则的“伪命名空间”:
<p>Hello world!</p>
<p>Some great content here!</p>
<div id="isolated-content"><p>Hello world styled differently!</p></div>
and
和
p {color:black;}
#isolated-content p {color:red;}
Would only apply red color to the second "Hello world" paragraph.
将只应用红色到第二个“Hello world”段落。
Naturally, all normal css mechanics still applies (inheritance, cascading etc.) so you may have to override the rules accordingly. Unless you provide specific scenario details, this is the most details I can offer.
当然，所有普通的css机制仍然适用(继承、级联等)，因此您可能需要相应地重写规则。除非您提供特定的场景细节，否则这是我所能提供的最详细的细节。