mui 写出Tab标签可滑动可点击的效果（下划线效果）

努力成为大佬的菜鸟

于 2020-03-19 16:12:23 发布

阅读量773

点赞数

分类专栏： html5 APP开发文章标签： javascript css

本文链接：https://blog.csdn.net/weixin_43815544/article/details/104969777

版权

本文展示了如何利用Mui技术实现Tab标签页的滑动和点击效果，并提供了包含下划线样式的代码示例，可以直接复制到HTML body中查看效果。

摘要由CSDN通过智能技术生成

效果图

在这里插入图片描述

代码

下划线

  <div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-3" ></div>

直接复制粘贴看效果（在body里面）

<div id="slider" class="mui-slider">
	    <div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
	    	<a class="mui-control-item mui-active" href="#item1mobile">选项1</a>
	    	<a class="mui-control-item" href="#item2mobile">选项2</a>
	    	<a class="mui-control-item" href="#item3mobile">选项3</a>
            <a class="mui-control-item" hre