<ul class="list-group mt-5 ">
   <li class="list-group-item mt-2 w-50 text-center active_1 "> <a href="/">网站首页</a> </li>
   <li class="list-group-item  mt-2 w-75 text-center active_1"><a href="{% url 'blog:index' %}">python/django文章</a></li>
   <li class="list-group-item  mt-2 text-center active_1"><a href="http://www.hui2017.top/blog/p/2/">精选教程</a></li>
   <li class="list-group-item  mt-2 w-75 text-center active_1"><a href="{% url 'blog:email_sub' %}">订阅文章</a></li>
   <li class="list-group-item  mt-2 w-50 text-center active_1"><a href="{% url 'comment:lyxx_list' %}">给我留言</a></li>
</ul>

/* 将li 下的a标签字体颜色设置为黑色 */
.active_1 a {
   color: #000;
   z-index: 1;
}

/*当该类被鼠标移动到时字体变白色*/
.active_1:hover a {
   color: #fff;
   z-index: 1;
}

/* 设置动画 ,取名叫sun*/
@keyframes sun{
   100%{
      background-position: -400% 0;
   }

}
  

/* 当鼠标移动到li上的时候 执行动画 */
.active_1:hover{
   animation: sun 8s infinite;/* 执行时常8s,循环执行 */
   /* 设置文字背景颜色为4个组合色 */
   background: linear-gradient(90deg,#03a9f4,#f441a5,#ffeb3b,#03a9f4);
   /* 拉伸背景色 */
   background-size: 400%;
}