用JS编写选项卡效果

本文实例为大家分享了JS编写选项卡效果的具体代码,供大家参考,具体内容如下

- 锐客网*{padding:0; margin:0; }.selectka {width:500px; height:400px; margin:auto; border:1px solid #09e1ff; }.left,.right{float:left; height:400px; }#menu{text-align: center; line-height: 80px; font-size: 20px; color:purple; }li{list-style: none; }#menu>li{width:100px; height:80px; border:1px dashed blueviolet; box-sizing: border-box; }.right{position: relative; width:399px; background: pink; margin-left:1px; text-align: center; font-size: 100px; line-height: 400px; }.right li{position: absolute; width:399px; height:400px; display: none; }
  • 衣服
  • 美妆
  • 包包
  • 美食
  • 首饰

【用JS编写选项卡效果】效果图:
用JS编写选项卡效果
文章图片

用JS编写选项卡效果
文章图片

用JS编写选项卡效果
文章图片

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

    推荐阅读