1、启动DW软件，按CTRL+N新建一个HTML文件
2、新建好html文件后，按F12可以打开浏览器预览我们制作的网页效果。因为现在网页什么都没有，所以是空白的噢
3、我们在head中写入引内嵌CSS的代码：
<style type="text/css"></style>
然后再body中添加一个div块：
<div></div>
4、为div引入一个CSS样式：
<div class="scroll"></div>
CSS样式，定义DIV的宽度高度，超出部分显示滚动条。代码如下：
.scroll{
width: 300px;
height: 100px;
overflow-y: scroll;
}
保存后刷新网页，可以看到效果，已经有了滚动条啦，但是因为没有内容，所以是空白的噢
5、在div中加入p标签，引入文字列表：
百度经验01
百度经验02
百度经验03
百度经验04
百度经验05
再保存刷新网页，可以看到外面写入的文字，超出的文字用滚动条上下拉可以看到噢。那怎么隐藏这个滚动条呢
6、在我们写的带有滚动条的div外层再添加一个新的div，添加后代码如下：
<div class="hidden">
<div class="scroll">
百度经验01
百度经验02
百度经验03
百度经验04
百度经验05
</div>
</div>
保存后刷新，是没有效果的噢，因为最外层的DIV是没有样式的噢
7、然后给最外层的div引入样式，设置的宽度要比内容的div要窄一点，然后设置超出的部分隐藏，这样就可以实现滚动条隐藏了。为了方便观察，我在这里给DIV添加一个灰色的边框。代码如下：
.hidden{
width: 280px;
height: 100px;
overflow: hidden;
border: 1px solid #d4d4d4;
}
保存后刷新网页可以看到滚动条已经成功隐藏啦。
