Question

我想改变激活元素的CSS样式。

Here's你可以看到一个离子列表。

我尝试像这样设置aktivated元素的css样式：

.item-content.activated{
    background-color: rgba(0,100,255, 0.5);
}

这不会改变任何事情

在离子的css框架中，我有这一行设置激活元素的样式：

.item.active, .item.activated, .item-complex.active .item-content, .item-complex.activated .item-content, .item .item-content.active, .item .item-content.activated      
{
   border-color: #ccc;
   background-color: #D9D9D9; 
}

如果我在框架中更改它，它可以工作。但我只想将它应用于列表项和我自己的css样式表中...我该怎么做？

Answer 1

您需要使用选择器：

.item .item-content.activated

它还有.item这么多specificity这就是为什么它会覆盖你写的那个。

Answer 2

您可以按照以下方式执行此操作

.item.active,
.item.activated,
.item-complex.active .item-content,
.item-complex.activated .item-content,
.item .item-content.active,
.item .item-content.activated {
    color: #493F0B;
    font-weight: bold;
    border-color: #eee;
    background-color: #fafafa;
}

离子覆盖活性元素css风格

2 个答案: