我想在单击时将心形变为黑色,但更改 .heart 的颜色不会影响它的 :before :after 选择器。有什么办法吗?
.heart {
background-color: red;
height: 60px; /*dimension of the square*/
position: relative;
top: 40px; /*position from top*/
transform: rotate(-45deg); /*negative = counter clockwise, put 0 to try*/
width: 60px; /*dimension of the square*/
transition: all 1s ease; /*length of animation*/
}
.heart:before,
.heart:after {
content:""; /*kosong, for it to exist*/
background-color: red;
border-radius: 50%; /*perfect round curve*/
height: 60px; /*dimension of the shape*/
position: absolute;
width: 60px; /*dimension of the shape*/
}
.heart:before { …Run Code Online (Sandbox Code Playgroud)