实现手机端类似vantUi tab栏横向滚动效果

添加剂shine

已于 2024-05-10 11:04:54 修改

阅读量506

点赞数 7

分类专栏： js基础文章标签： javascript html5

于 2024-05-09 17:50:26 首次发布

本文链接：https://blog.youkuaiyun.com/m0_52039188/article/details/138623918

版权

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<style>
            li{
                list-style: none;
            }
			#supervisor .select ul {
				overflow-x: auto;
				white-space: nowrap;
				width: 100%;
				scrollbar-width: none;
				display: flex;
				position: relative;
				-webkit-overflow-scrolling: touch;
				box-sizing: content-box;
				height: 100%;
                padding: 0;
			}

			#supervisor .select ul li {
				cursor: pointer;
				position: relative;
				flex: none;
				margin-right: 0.15rem;
				border-radius: 2rem;
				border: 1px solid rgba(0, 0, 0, 0);
				padding: 0.08rem 0.16rem;
			}

			#supervisor .select ul li.isshow {
				border: 1px solid #e26656;
				color: #e26656;
			}
			#supervisor .select u