* { margin:0; padding:0; list-style:none; } .nav { margin-top:10px; } .nav li { float:left; margin:0 15px; } .nav li a { text-decoration:none; color:#000; text-align:center; display:block; } .nav li a span { height:3px; background:red; display:block; margin-top:10px; transition:transform 0.5s; transform:scaleX(0); transform-origin:100% 0; } .nav li a:hover span { transform:scaleX(1); transform-origin:0 0; }
css3边框动画左进右出