使用scss在父类上悬停伪元素

Question

如何将以下CSS转换为SCSS？

.parent-class:hover .child-class { 
    visibility: visible; 
    animation-name: bounceIn; 
    animation-duration: 450ms; 
    animation-timing-function: linear; 
    animation-fill-mode: forwards; 
    transition-delay:0s; 
} 

下面的代码似乎并没有工作：

.parent-class{ 
    &:hover .childclass{ 
    visibility: visible; 
    animation-name: bounceIn; 
    animation-duration: 450ms; 
    animation-timing-function: linear; 
    animation-fill-mode: forwards; 
    transition-delay:0s; 
    } 
} 

Answer 1

你SCSS具有正确的想法 - 除非你已经在你的类名称的拼写错误：

.childclass - >.child-class

.parent-class{ 
    &:hover .child-class{ 
    visibility: visible; 
    animation-name: bounceIn; 
    animation-duration: 450ms; 
    animation-timing-function: linear; 
    animation-fill-mode: forwards; 
    transition-delay:0s; 
    } 
} 

Answer 2

丹菲尔德是正确的，只是为了使它更简洁：

.parent-class { 
    &:hover .child-class { 
    visibility: visible; 
    animation: bounceIn 450ms linear forwards; 
    transition-delay: 0s; 
    } 
}