zoukankan      html  css  js  c++  java
  • 可左右滑动的选项卡

    可左右滑动的选项卡(快捷键mt 提示出来的第三个)  (下面的 类mui-slider-progress-bar里面的栅格根据选项卡的数量和调整)

    <div class="mui-slider">
    <div class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
    <a class="mui-control-item" href="#item1">选项卡1</a>
    <a class="mui-control-item" href="#item2">选项卡2</a>
    <a class="mui-control-item" href="#item3">选项卡3</a>
    <a class="mui-control-item" href="#item4">选项卡4</a>


    </div>
    <div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-3"></div>
    <div class="mui-slider-group">
    <div id="item1" class="mui-slider-item mui-control-content mui-active">
    <ul class="mui-table-view">
    <li class="mui-table-view-cell">第1个选项卡子项</li>
    <li class="mui-table-view-cell">第1个选项卡子项</li>
    </ul>
    </div>
    <div id="item2" class="mui-slider-item mui-control-content">
    <ul class="mui-table-view">
    <li class="mui-table-view-cell">第2个选项卡子项</li>
    <li class="mui-table-view-cell">第2个选项卡子项</li>
    </ul>
    </div>
    <div id="item3" class="mui-slider-item mui-control-content">
    <ul class="mui-table-view">
    <li class="mui-table-view-cell">第3个选项卡子项</li>
    <li class="mui-table-view-cell">第3个选项卡子项</li>
    </ul>
    </div>
    <div id="item4" class="mui-slider-item mui-control-content">
    <ul class="mui-table-view">
    <li class="mui-table-view-cell">第4个选项卡子项</li>
    <li class="mui-table-view-cell">第4个选项卡子项</li>
    </ul>
    </div>
    </div>
    </div>

  • 相关阅读:
    fescar源码解析系列(一)之启动详解
    dubbo源码解析二 invoker链
    dubbo源码解析一
    CSP-S 2021 游记
    使用SpEL记录操作日志的详细信息
    Router 重定向和别名是什么?
    vue项目做seo(prerender-spa-plugin预渲染)
    vue3.0初体验有哪些实用新功能
    uniapp弹窗踩坑
    Spring boot application.properties 配置
  • 原文地址:https://www.cnblogs.com/yaomengli/p/6774497.html
Copyright © 2011-2022 走看看