css 给div添加滚动并隐藏滚动条

css 给div添加滚动并隐藏滚动条

在html中

<div class="box">

    <div>下面内容会单独滚动</div>

	<div class="scroll">

		<div class="content">

		    <p>1111111111111111</p>

		    <p>222222222222222</p>

		    <p>333333333333333</p>

		    <p>4444444444444444</p>

		    <p>1111111111111111</p>

		    <p>222222222222222</p>

		    <p>333333333333333</p>

		    <p>4444444444444444</p>

		</div>

	</div>

</div>

css部分

<style>

	div{

		font-size: 15px;

		margin-bottom: 20px;

	}

	.content{

		height: 300px;v // 必须设定滚动部分的高度

		background-color: cadetblue;

		color: antiquewhite;

		overflow-x: hidden; /*x轴禁止滚动*/

    	　　　　 overflow-y: scroll;/*y轴滚动*/

	}

	.content::-webkit-scrollbar {

		display: none;/*隐藏滚动条*/

	}

	p{

		margin-bottom: 30px;

		font-size: 17px;

		color: #333;

	}

</style>