移动端小技巧积累

最新推荐文章于 2022-07-12 17:59:58 发布

单眼皮的小熊

最新推荐文章于 2022-07-12 17:59:58 发布

阅读量192

点赞数

分类专栏： H5 文章标签：移动端

本文链接：https://blog.csdn.net/z858466/article/details/80159071

版权

H5 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1. 移动端上水平溢出滚动（无滚动条，只有移动端有效）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
	</head>
	<style>
		.div{width:100%;height:40px;overflow: hidden;}
		.box{width:100%;white-space: nowrap;overflow: auto;height: 60px;}
		.box div{width:100px;min-width: 100px;display: inline-block;}
	</style>
	<body>
		<div class="div">
			<div class="box">
				<div datasrc="1">最新要闻1</div>
				<div datasrc="2">最新要闻2</div>
				<div datasrc="3">最新要闻3</div>
				<div datasrc="4">最新要闻4</div>
				<div datasrc="5">最新要闻5</div>
				
				<div datasrc="6">最新要闻6</div>
				<div datasrc="7">最新要闻7</div>
				<div datasrc="8">最新要闻8</div>
				<div datasrc="9">最新要闻9</div>
				<div datasrc="10">最新要闻10</div>
			</div>
		</div>
	
	</body>
</html>