Question

如果将hss元素悬停在任何一个框中，并且两个元素的属性都可以更改，那么如何在两个以上的html元素上应用css属性。

.tab-sec:hover{
    background-color:#1b9927;
    border: 1px solid #4e4e4e;
    color: #000;
    h5{
        color: #fff;
    }
}

我试过这种方式，但它无法正常工作。

Answer 1

您只能使用CSS预处理器（如LESS和SASS）嵌套样式。

我想在你需要写下这样的风格之后得到你的意思：

.tab-sec:hover{
    background-color:#1b9927;
    border: 1px solid #4e4e4e;
    color: #000;
}

.tab-sec:hover h5{
    color: #fff;
}

Answer 2

试试这个，

＆＃13;

<!DOCTYPE html>
<html>
<head>
<style>

.over_class:hover {
   border-style: solid;
   border-color:#1b9927;
   color: hotpink;
}
  
</style>
</head>
<body>
<input type="text" class="over_class" /><br/></br/>
<input type="text" class="over_class" /></br/></br/>
<input type="button" class="over_class" value="Submit" />  
  
</body>
</html>

＆＃13;

Answer 3

试试这个。此代码适用于.scss

.tab-sec{
    background-color:#1b9927;
    border: 1px solid #4e4e4e;
    color: #000;
    &:hover {
/* for tab sec*/
    background-color: #ff000;
/*for child elements*/
    h5{
        color: #fff;
    }
  }
}

当我将hss元素悬停在任何一个框

3 个答案: