gpt4 book ai didi

css - IE11 中的 Lit 元素,自定义元素外部的 css 样式影响内部样式

转载 作者:行者123 更新时间:2023-11-27 23:30:31 25 4
gpt4 key购买 nike

在我的应用程序中为 p 元素设置 css 样式只会影响 IE11 中 lit 元素内的 p 元素。

我已经设置了一个非常基本的 stackblitz显示问题的示例。当您在 IE11 中打开它时,您会注意到自定义元素 p 文本是斜体的,该样式来自外部。在其他浏览器中,这不会发生。

对于 IE11,这是一个已知问题并且无法阻止吗?或者有什么办法可以解决这个问题?

最佳答案

我已经在我这边重现了这个问题,这可能是 IE 浏览器的默认行为。因为外面的CSS样式是全局样式。

作为解决方法,您可以更改选择器以阻止它们匹配您不希望它们匹配的元素。如 following sample (使用类选择器添加 CSS 样式):

index.html页面中的代码:

  <style>
.outer-p { font-style: italic; }
</style>
</head>
<body>
<p class="outer-p">Text outside element</p>
<my-element></my-element>
</body>

自定义元素中的代码(my-element.js)

class MyElement extends LitElement {
static get styles() {
return css`
.inner-p { display:block; font-weight: 900; color: #ff9900; }
`;
}

render() {
return html`
<p class="inner-p">Hello world! From my-element</p>
`;
}
}

关于css - IE11 中的 Lit 元素,自定义元素外部的 css 样式影响内部样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57505188/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com