Question

我得到的元素在一些伪类之后使用，它工作正常，直到我想要它颠倒翻转并添加转换效果，它失败了。最终结果是整个li转换。

    .dropdown-menu li a:first-child:nth-last-child(2):after {
      content: '';
      background-color: #fff;
      background:url('../img/open.png') no-repeat;
      width: 18px;
      height: 10px;
      display:inline-block;
      margin:-15px 0 0 35px;
      float: right;

}
.dropdown-menu li a:hover{
        -ms-transform: rotate(180deg); /* IE 9 */
        -webkit-transform: rotate(180deg); /* Safari */
        transform: rotate(180deg);
        }

同样值得在css或jquery中进行，因为css3支持可能有限吗？

Answer 1

我在@harry的帮助下解决了它并且它有效。我的目标是错误的孩子。正确的代码是

    .dropdown-menu li a:first-child:nth-last-child(2):after {
      content: '';
      background-color: #fff;
      background:url('../img/open.png') no-repeat;
      width: 18px;
      height: 10px;
      display:inline-block;
      margin:-15px 0 0 35px;
      float: right;

}
.dropdown-menu li a:hover:after{
    -ms-transform: rotate(18deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);
    -webkit-transition-timing-function: linear; /* Safari and Chrome */
    transition-timing-function: linear;
        }

旋转css伪类中定义的元素

1 个答案: