gpt4 book ai didi

CSS继承和特殊性

转载 作者:太空宇宙 更新时间:2023-11-04 16:20:43 25 4
gpt4 key购买 nike

我在使用 CSS 样式表时遇到问题。我已将其缩小为关于 css 样式中的继承和特异性。

现在(简化)我有一个 HTML <body>看起来像下面这样:

<div id="page-wrap">
<div class="unilogin-wrap">
<h1 class="unilogin-h1">Hello world!</h1>
</div>
</div>

现在,这是需要在多个网站上使用的 uni-login 表单的一部分,因此它具有针对特定 unilogin 样式的单独样式表。但是在网站样式表 (style.css) 中设置了以下内容:

#page-wrap h1{
font-size:18px;
margin-bottom: 18px;
margin-left:15px;
}

并且在 unilogin 样式表 (unilogin.css) 中设置了以下内容:

.unilogin-wrap h1.unilogin-h1 {
padding:0;
margin:0;
font-size:18px;
color:#596168;
text-shadow: 1px 1px 0px #fff;
}

但是,这不会覆盖从 style.css 继承的 h1 样式。如果我把 #page-wrap h1.unilogin-h1{}相反,它工作得很好。这不是一个选项,因为它必须在多个网站上工作,所有网站都具有我无法更改的不同样式表。

有什么方法可以在不使用内联 html 样式的情况下覆盖第二个样式表中继承的 h1 样式的特殊性? (我知道 style=""html 属性具有更高的特异性,但我更喜欢将样式保留在样式表中)。

谢谢...

最佳答案

尝试更改 .unilogin-wrap h1.unilogin-h1 {

#unilogin-wrap h1.unilogin-h1 {

.unilogin-wrap作用于 <whatever class="unilogin-wrap"#unilogin-wrap<whatever id="unilogin-wrap"

关于CSS继承和特殊性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6640840/

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