基于JavaScript实现Tab选项卡切换效果

本文实例为大家分享了Android九宫格图片展示的具体代码，供大家参考，具体内容如下

 
 
 
 * {
  padding: 0;
  margin: 0;
 }
 .box {
  width: 500px;
  height: 400px;
  border: 1px solid #ccc;
  margin: 100px auto;
  overflow: hidden;
 }
 ul {
  width: 600px;
  height: 40px;
  margin-left: -1px;
  list-style: none;
 }
 li {
  float: left;
  width: 101px;
  height: 40px;
  text-align: center;
  font: 600 18px/40px "simsun";
  background-color: pink;
  cursor: pointer;
 }
 span {
  display: none;
  width: 500px;
  height: 360px;
  background-color: yellow;
  text-align: center;
  font: 700 150px/360px "simsun";
 }
 .show {
  display: block;
 }
 .current {
  background-color: yellow;
 }
 

 



 
 

  
鞋子
  
袜子
  
帽子
  
裤子
  
裙子
 
 鞋子
 袜子
 帽子
 裤子
 裙子
 

 
 

  
鞋子
  
袜子
  
帽子
  
裤子
  
裙子
 
 鞋子
 袜子
 帽子
 裤子
 裙子
 

 
 

  
鞋子
  
袜子
  
帽子
  
裤子
  
裙子
 
 鞋子
 袜子
 帽子
 裤子
 裙子
 

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。