tab切换在网页中很常见，故最近总结了4种实现方法。
首先，写出tab的框架，加上最简单的样式，代码如下：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <style> 6 *{ 7 padding: 0; 8 margin: 0; 9 } 10 li{ 11 list-style: none; 12 float:left; 13 } 14 #tabCon{ 15 clear: both; 16 } 17 </style> 18 </head> 19 <body> 20 <div id="tanContainer"> 21 <div id="tab"> 22 <ul> 23 <li>标题一</li> 24 <li>标题二</li> 25 <li>标题三</li> 26 <li>标题四</li> 27 </ul> 28 </div> 29 <div id="tabCon"> 30 <div>内容一</div> 31 <div>内容二</div> 32 <div>内容三</div> 33 <div>内容四</div> 34 </div> 35 </div> 36 </body> 37 </html>