Question

为什么转换在伪元素中不起作用：在/：之前。

我只想把它放在我的CSS中，但不，不起作用。

.edicao-fotos-2 li a:hover{
transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
-moz-transition:0.6s;
-webkit-transition:0.6s;
}

.edicao-fotos-2 li a:hover:after{
content: '';
width:244px;
height:243px;
background:rgba(0, 0, 0, 0.6);
position:absolute;
top:-228px;
left:0;
transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
-moz-transition:0.6s;
-webkit-transition:0.6s;
}

谢谢大家。

Answer 1

您没有.edicao-fotos-2 li a:after的任何默认值。

/**
 * example values:
 * this will animate width and height
 */
.edicao-fotos-2 a:after {
    content: "";
    width: 0;
    height: 0;
}

.edicao-fotos-2 li a:hover:after{
    content: '';
    width:244px;
    height:243px;
    background:rgba(0, 0, 0, 0.6);
    position:absolute;
    top:-228px;
    left:0;

    -webkit-transition:0.6s;
       -moz-transition:0.6s;
        -ms-transition:0.6s;
         -o-transition:0.6s;
            transition:0.6s;
}

如果您不应用默认值，浏览器将不知道如何开始动画。

DEMO

注意：您还应该编写以供应商前缀开头的转换规则，而不是相反。

Answer 2

Chrome 32中的所有works fine。问题可能在order和value语法中。尝试其他订单，不仅要添加延迟值：

-o-transition: all 0.6s;
-ms-transition: all 0.6s;
-moz-transition: all 0.6s;
-webkit-transition: all 0.6s;
transition: all 0.6s;

更改您房产的全部内容。

：转换后不起作用

2 个答案: