CSS实现隐藏滚动条的同时保留滚动效果

在页面中想要实现一个固定大小区域的内容纵向滚动，此区域的内容是动态渲染的，也就是内容可以在通过后台编辑修改。当内容较少时，如果出现滚动条会影响页面的美观。我们可以设置超出隐藏滚动条的方法实现。

html结构：

<div class="wrap">
<div class="container">
<p>多年来公司坚持科技创新，与时俱进，为众多国内外著名五星级酒店设计和制造智能控制 系统和智能开关面板。
在行业中，我司首家实现了模块化、自主编程的通用型酒店客房电器控制系统，
在此基础上再创 新建立智控云控智能服务系统，实现对各种灯具的调光、灯光场景、窗帘、空调、
红外及各种传感器进行综合控制和遥 控。在智能控制面板方面，我司拥有品种规格众多、功能齐全、设计新颖的系列产品，
并根据客户的需求对智能开关面 板进行个性化设计，深受用户青睐。
</p>
</div>
</div>

.wrap{
width: 450px;
height: 300px;
overflow: hidden;
}
.container{
width: 460px;
overflow-y: scroll;
height: 100%;
}

总结：

2、内层元素必须设置overflow-y：scroll；

3、内层的宽度必须大于外层的宽度，且正好把滚动条给遮住；

4、内层height：100%；才能有滚动效果；

效果展示：