怎么说呢,最近在写一个后台管理模板,发现以前写的tab切换现在有点达不到自己心里的标准,所以就重新写了一个,本着拥抱原生js的原则,就放弃了jQuery。下面废话不多说,先看一下效果图吧:
看一下效果图,如果是您想要的话,那么您再继续往下面看,算了,还是直接一点直接上代码吧,下面代码不依赖任何插件,也就是说,您直接复制一下打开就能看效果啦。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>js实现tab切换</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
ul {
list-style: none;
}
.container {
margin: 100px;
}
.tab_ul {
background-color: #5edbbe;
overflow