css超出不换行可滑动


<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
		<title>css超出不换行可滑动</title>
		<style type="text/css">
			.wrapper .list {
				width: 100%;
				height: 20px;
				display: inline;
				white-space: nowrap;
				overflow-x: scroll;
				float: left;
				overflow-y: hidden
			}
			
			.wrapper .list li {
				display: inline-block;
				margin: 0;
			}
		</style>
	</head>

	<body>
		<div class="wrapper">
			<ul id="list" class="list">
				<li>测试测试测试测试超出不换行可以滑动测试测试测试测试超出不换行可以滑动测试测试测试测试超出不换行可以滑动测试测试测试测试超出不换行可以滑动</li>
			</ul>
		</div>
	</body>

</html>

项目使用场景


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM