← 返回文章列表 深入理解CSS之overflow:hidden,scroll,visible
1

深入理解CSS之overflow:hid…

一、Overflow语法值 overflow : visible | auto | hidden | scroll 当然overflow可以单独设置X(overflow-x )和Y(overflow-y)方向的滚动条样式其值与应用与overflow语法用法结构相同。 二、Overflow参数值解释  立即学习“前端免费学习笔记(深入)”; visible :  不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效 auto :  此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条,DIV默认情况也是这个值,但需要设置时候设置即可 hidden :  不显示超过对象尺寸的内容 scroll :  总是显示滚动条 三、Overflow特别解释说明 检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。 设置textarea对象为hidden值将隐藏其滚动条。 对于table来说,假如table-layout属性设置为fixed,则td对象支持带有默认值为hidden的overflow属性。如果设为hidden,scroll或者auto,那么超出td尺寸的内容将被剪切。如果设为visible,将导致额外的文本溢出到右边或左边(视direction属性设置而定)的单元格。自IE5开始,此属性在MAC平台上可用。 四、重点学习Overflow  Overflow:visible 此样式可以让滚动条隐藏,但可以鼠标上拉下拉滑动。 Overflow:hidden 隐藏对象超出设置宽度高度的内容 Overflow:scroll 此样式,会让内容无论是否超出高度宽度也会显示滚动条。 五、Overflow:hidden与Overflow:scroll实践  我们通过同样的宽度高度设置,一个隐藏超出宽度高度内容,一个为显示滚动条,为了案例演示,我们对案例2个对象加CSS border边框。 总结:Overflow css样式我们常常用于隐藏于显示滚动条,同时可以隐藏超出大小宽度高度显示对象的内容,非常简单如果不能拼写此单词也无所谓,看到就能认识常用到地方,基本语法结构等借助于DW软件快速输入即可。

最后修改: 2025/8/19 11:53:47

读者评论
【免登录留言】
验证码

相关文章推荐

菜鸟云网络科技简介
活动方案
菜鸟云网络科技简介

菜鸟云网络学院开学了!菜鸟云自己开发的网站CMS!快来学习吧……

菜鸟云网络科技个性化定制中心
5
菜鸟云网络科技个性化定制中心

菜鸟云网络科技个性化定制中心欢迎您

Bootstrap5 教程
10
Bootstrap5 教程

Bootstrap 是全球最受欢迎的前端组件库,用于开发响应……

探索ISBN查询接口:为图书管理系统赋能
3
探索ISBN查询接口:为图书管理系统赋能

在开发图书管理应用时,ISBN(国际标准书号)查询接口是获取……

菜鸟网络学院简介
5
菜鸟网络学院简介

菜鸟网络学院是一家个人创建的学习网站,属于日志文章分享,开源……

《文化苦旅》散文集
3
《文化苦旅》散文集

《文化苦旅》一书于1992年首次出版,是余秋雨先生1980年……

CSS3 圆角
12
CSS3 圆角

CSS3 圆角

谢谢你曾来过我的世界
3
谢谢你曾来过我的世界

少年读《射雕英雄传》,最想化身的人物是陈玄风,脸色焦黄,有如……

Bootstrap5 安装使用
10
Bootstrap5 安装使用

我们可以通过以下两种方式来安装 Bootstrap5: 使……

Excel中生成序号技巧
1
Excel中生成序号技巧

在Excel中生成序号是日常操作,以下介绍几种常用方法,可根……