css3过渡效果

a{
  font-family:sans-serif;
  color:#fff;
  text-indent:1rem;
  background-color:#ccc;
  display:inline-flex;
  flex:1 1 20%;
  font-size:2rem;
  align-self:stretch;
  align-items:center;
  text-decoration:none;
  transition:box-shadow 1s;
}
a+a{
  border-left:1px solid red;
}
a:hover{
  box-shadow:inset 0 -3px 0 #CC3232;
}

1）a+a选择器，让第一个div元素不会被选中

2）box-shadow元素不影响页面布局，但border元素会影响

3）transition实现css3过渡效果