DIV滚动条设置添加 CSS滚动条显示与滚动条隐藏

纵向滚动条


overflow-y:scroll; 总是显示纵向滚动条
overflow-y:visible : 不剪切内容也不添加纵向滚动条

横向滚动条

overflow-x:scroll; 总是显示横向滚动条
overflow-x:visible : 不剪切内容也不添加横向滚动条

使用演示


<div id="content">
                <h2 id="content-title">欢迎大家进入聊天室</h2>
                <hr/>
                <div id="show_msg">
                    <p>小都都对大家说:对啊</p>
                    <p>天之城对大家说:明天还会讲</p>
                </div>
            </div>

我们要对上面ID为content的设置滚动条,因为它是聊天内容区,那么contemt的css是:
#content { float:left; width:100%; height:300px; text-indent:30px; background:#CCEE29;overflow-y:scroll; overflow:hidden;}

其中最重要的三样:
height:300px //使用滚动条需要设置高度
overflow-y:scroll; //这儿是纵向滚动条
overflow:hidden;  //这儿设置内容超出高度后隐藏

评论

大侠名号:   验证码: 点击我更换图片  

修远兮

在这里记录每一点自己需要的知识

添加创始人微信,一起交流心得

推荐文章RECOMMEND