overflow 属性规定当内容溢出元素框时发生的事情
①visible 默认值。内容不会被修剪,会呈现在元素框之外。
②hidden 内容会被修剪,并且其余内容是不可见的。
③scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
④auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
⑤inherit 规定应该从父元素继承 overflow 属性的值。
例子一:table做容器且【隐藏】滚动条
注意:{①table的dispaly设置为block,否则不会出现滚动条}
要先把table放到一个p中,p的长度和宽度要固定
如果只想垂直方向有滚动,可以设置外面p属性overflow-x: hidden;
立即学习“前端免费学习笔记(深入)”;
例子:
装修公司源码,采用DIV+CSS布局,首页顶部采用了超大宽屏banner焦点图切换,带伸缩功能的导航条。首页信息展示量大,有利于SEO优化,首页版块包括,导航,焦点图切换,案例,行业动态,装修经验,装修知识。源码支持伪静态,后台开启即可,服务器必须支持rewrite功能,否则无法实现伪静态功能。信息支持二级分类。后台支持信息批量修改,删除,可以支持,视频,图片,附件上传。
滚动条
| 1 |
| 2 |
| 3 |
| 4 |
| 5 |
| 6 |
这里注意修改table属性
例子二:
ul作容器,隐藏滚动条
滚动条
- 1
- 2
- 3
- 4
- 5
- 6
原理:在容器外面再嵌套一层 overflow:hidden 内部内容再限制尺寸和外部嵌套层一样,就变相隐藏了。









