tab切换栏原理--应用实际网站开发 手写代码案例

tab切换栏原理–应用实际网站开发 手写代码案例

tab栏切换在网页开发中非常常见，是前端开发的必需学会的案例，一些tab栏切换和商品信息分栏切换等：

实现代码：

	<style type="text/css">
			* {
    
				margin: 0;
				padding: 0;
			}
			
			li {
    
				list-style: none;
			}
			
			ul {
    
				margin: 50px auto;
			}
			
			.box {
    
				width: 600px;
				height: 600px;
				border: 1px solid black;
				margin: 50px auto;
			}
			li {
    
				width: 120px;
				height: 30px;
				border: 1px solid pink;
				float: left;
				box-sizing: border-box;
				text-align: center;
				line-height: 30px;
				background-color: grey;
				cursor: p