纯css实现元素下出现横线动画(background image)

效果图: html: 首页 css: .site_bar{ background-image : linear-gradient(red,red); background-position : center bottom; background-size : 0 2px; background-repeat : no-repeat; //这个属性不能少。 transition : .3s; } .site_bar:hover{ background-size : 100% 2px; } 总结 以上所述是小