* { box-sizing:border-box; } nav { width:600px; margin:auto; height:30px; position:relative; background-color:orange; display:flex; } nav span { display:block; height:30px; line-height:30px; padding:0 10px; float:left; text-align:center; cursor:pointer; } nav span { z-index:1; } nav .bg_red { background-color:red; color:white; width:52px; z-index:10; margin-right:1px; } #leave { position:absolute; left:0px; height:30px; background-color:red; z-index:1; } nav .red { background-color:red; color:white; }
手写导航条随鼠标移动效果,代码简单,易使用