Question

我有这个css来转换一个border-left，在悬停时会向右移动一个滑动效果。当鼠标从一个标签出来时，border-left应该转换回0px，并且应该发生一个向左滑动的效果，但它不会发生。怎么了？

a {
  border-left: 0px solid #32acaf;
  transition: border-left 0.7s;
}

a:hover {
  background-color: #473828;
  color: rgba(255, 255, 255, 1) !important;
  border-left: 7px solid #32acaf;
  transition: border-left 0.2s;
}

Answer 1

我已经使用了你提供的css代码，并在大多数浏览器中检查了输出我添加了html和css代码以及jsfiddle，如。

HTML

<a>hai</a>

CSS

a {
  border-left: 0px solid #32acaf;
  transition: border-left 0.7s;
}

a:hover {
  background-color: #473828;
  color: rgba(255, 255, 255, 1) !important;
  border-left: 7px solid #32acaf;
  transition: border-left 0.2s;
}

jsfiddle链接

http://jsfiddle.net/4ZeCz/1929/

左边框上的css过渡在悬停时起作用，但在鼠标输出上不起作用

1 个答案: