我遇到了一个有趣的情况，我正在尝试寻找解决方案。
需要包含一个脚本来在页面上构建 HTML 元素。问题在于，全局默认 CSS 样式与此内置元素交互并阻止其运行。
因此，我们的“.core-design form”有一个应用于此构建元素表单的属性。不需要使用我们的任何样式，因为脚本正在其自己的样式表中调用。
有没有办法阻止包含此元素的 div 从我们的 .core-design 获取任何和所有样式？
编辑:增加一些细节的清晰度。
1) 核心设计类附加到许多站点的每个页面。
2) 目标子元素是元素名称，而不是类。
3) 我能够添加样式以围绕生成的内容定位 div，但由于其范围而希望避免修改 .core-design 样式表。
4) 生成的内容会引入自己的样式表。
5) 我无法控制所拉入的内容，并且将来可能会发生变化。
6) Codepen of the situation I am currently in
body {
// the .core-design is applied here which contains the form styles.
}
form {
min-height:300px;
min-width:300px;
background-color:black;
}<body>
<div class="controlled">
<div class="generated">
<form>
<!--
I need to prevent this form/generated div from inheriting any styles. Including any other sub-components inside of it. The only item I 'control' is the wrapping div.
-->
</form>
</div>
</div>
</body>最佳答案
是的，有办法。您可以使用 all CSS 属性。更多信息请点击 https://developer.mozilla.org/en-US/docs/Web/CSS/all .
不支持 IE :(，但有可用的 polyfill。
关于javascript - 如何防止样式进入div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44464975/