HTML部分
<ul class="navmenu"> <li><a>选项卡 1</a></li> <li><a>选项卡 2</a></li> <li><a>选项卡 3</a></li> </ul>
CSS部分
.navmenu { display: flex; justify-content: space-between; } .navmenu li{ list-style: none;cursor: pointer; } .navmenu li a{ padding:5px 10px; } .navmenu li.active a{ color: #fff; background-color:#f06b03; }
JavaScript部分
jQuery(".navmenu").on('click','li',function(){ jQuery(this).addClass("active").siblings().removeClass("active"); });