如何在 hover 过一个条目的时候，增加渐进的特效？

Can I use?

› http://caniuse.com/

Less

› http://lesscss.org

Cool Libraries

› Bootstrap from Twitter

› Jetstrap

This topic created in 1929 days ago, the information mentioned may be changed or developed.

主要，有两个特效的问题，

经常看到一些列表 /list，里面有一些 items

当鼠标划过的时候(hover),item 会高亮，比如，底色变化成另外一种颜色。关键是，会有一个“逐渐明亮”或者“逐渐变化”的过程。

这个是如何实现的。

比如，我现在的 item css，会有一个 hover, 但真的只能“变色”，而且是突变，没有渐变的特效。

const StyledContainer = styled.div<Props>`
  display: flex;
  padding-left: ${props => props.level * defaultIndent}px;
  width: 100%;
  height: ${props.theme.size.xxxl};
  align-items: center;
  background: ${props =>
    !props.isSelected
      ? props.theme.color["300"]
      : props.theme.color["100"]};

  &:hover {
    background: ${props => props.theme.color["200"]};
  }
`;