对于我正在开发的应用程序,我想内置生成发票的功能。该发票是可配置的,我想在我的页面中显示预览。根据我发送回 C# 后端的数据,我将生成一个可供下载的 .PDF 文件。
在后端生成过程中,我将无法访问样式表,并且必须完全内联定义所有类。因为我希望我的预览真正匹配发票最终的外观,所以我需要能够从预览元素中排除所有其他样式。
有办法做到这一点吗?
示例:
<link href="Content/style.css" rel="stylesheet" />
<div>
<p>Use classes defined in style.css</p>
<div EXCLUDE CSS OUTSIDE THIS SCOPE>
<p>No access to style.css</p>
</div>
</div>
我知道,只需确保预览器放置在我注入(inject) CSS 的范围之外,就可以实现所需的效果,但由于我的元素结构,这不是一个选项。
额外信息:
我正在使用我正在执行此元素的公司购买的样式表。然而,样式表的设置非常糟糕,并且包含各种默认样式,例如:
table {
color: black !important;
}
我正在寻找一种方法来排除所有样式,而不必单独覆盖该样式表中设置的每个属性。
最佳答案
有 all
属性和 initial
值,用于将属性重置为浏览器的默认设置。因此,如果您将想要从样式中“排除”的部分包装到应用了如下所示的类的标记中(即与 *
选择器结合使用),它应该具有您的效果想要:
.unset * {
all: initial;
}
在 HTML 中:
<div>
<p>Use classes defined in style.css</p>
<div class="unset">
<p>No access to style.css</p>
</div>
</div>
但不幸的是,all
尚未在 IE/Edge 中工作,它正在“考虑中”:http://caniuse.com/#search=all
不过,如果您的样式表没有使用太多不同的属性(如果您知道它们),您可以列出这些属性,将它们全部定义为 initial
并应用它,使用选择器作为如上所示。示例:
.unset * {
font-size: initial;
color: initial;
background: initial;
text-decoration: initial;
margin: initial;
padding: initial;
}
关于html - 排除样式表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42436740/