如何在多個元素上應用css懸停

Question

您好我正在使用只有css的簡單懸停。我很好奇，是否可以將一個鼠標懸停在多個html元素上。這裏是我的例子：

.work-cart{ 
    z-index: 4; 
    position: absolute; 
    width: 250px; 
    height: 300px; 
    left: 200px; 
    opacity: 0; 
    background: #fff; 
    padding-right: 45px; 
    padding-left: 45px; 
    padding-bottom: 30px; 
    padding-top: 150px; 
    text-align: right; 
    bottom: 0; 
    -webkit-transition: all 0.8s ease; 
    -moz-transition: all 0.8s ease; 
    -o-transition: all: 0.8s ease; 
    transitions: all 0.8s ease; 
} 
.f:hover > .work-cart{ 
    left: 220px; 
    opacity: 1; 
} 
.g:hover > .work-cart{ 
    left: 220px; 
    opacity: 1; 
} 
.h:hover > .work-cart{ 
    left: 220px; 
    opacity: 1; 
} 

是否有任何選項可以一次設定.f .g和.h的​​懸停？

Answer 1

您可以嘗試

.f:hover > .work-cart, .g:hover > .work-cart, .h:hover > .work-cart{ 
    left: 220px; 
    opacity: 1; 
}