`
wxinpeng
  • 浏览: 589452 次
  • 性别: Icon_minigender_1
  • 来自: 青岛
社区版块
存档分类
最新评论

overflow 标签

    博客分类:
  • web
阅读更多
 overflow 标签

  参考语法:

  overflow : visible | auto | hidden | scroll

  参数:

  visible :  不剪切内容也不添加滚动条。假如显式声明此默认值,对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效
  auto :  此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
  hidden :  不显示超过对象尺寸的内容
  scroll :  总是显示滚动条
    说明:

  检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。
  设置textarea对象为hidden值将隐藏其滚动条。
  对于table来说,假如table-layout属性设置为fixed,则td对象支持带有默认值为hidden的overflow属性。如果设为hidden,scroll或者auto,那么超出td尺寸的内容将被剪切。如果设为visible,将导致额外的文本溢出到右边或左边(视direction属性设置而定)的单元格。
  
OVERFLOW:hidden---这样超出部分会自动隐藏,这样做不好的地方是就是这部分的信息显示不完全,比如图片只显示了一部分. 但是页面布局不会乱.要注意的是,使用overflow的时候,一定要定义width,百分比或者具体值都可以。(在用ul和li做图片列表排列的时候,也可以用这个,这样避免一些大尺寸图搞乱布局,也可以解决浏览器窗口缩小时,li元素自动回行排列出错的问题)
注:用overflow:auto,还可以在页面里模仿出IFRAME的效果。
相同点:二者的对象均不可见。
不同点:
display:none
CSS1 隐藏对象。与 visibility 属性的hidden值不同,不为被隐藏的对象保留其物理尺寸空间。 该对象所占的尺寸空间被删除。
visibility:hidden
对象隐藏,与 display 属性不同,此属性为隐藏的对象保留其占据的物理尺寸空间。该对象所占的尺寸空间还存在。
分享到:
评论

相关推荐

    DevExpress相关论坛和网站

    7. DevExpress Stack Overflow标签(https://stackoverflow.com/questions/tagged/devexpress) 在Stack Overflow这个全球最大的开发者问答社区,有专门的DevExpress标签,开发者可以在这里寻找已有的解决方案,...

    idea参考文件

    7. **社区资源链接**:指向IntelliJ IDEA用户论坛、Stack Overflow标签页或其他社区资源的链接,便于开发者寻求帮助和交流经验。 通过学习和实践这些参考文件,开发者可以掌握如何高效地使用IntelliJ IDEA,包括但...

    spring-boot详情

    Spring 社区提供了多种途径来获取帮助,包括官方论坛、Stack Overflow 标签(如 `spring-boot`)、邮件列表和GitHub上的问题跟踪器。此外,文档中通常会提供如何报告问题和寻求帮助的指引。 3. **第一步** 开始...

    DataflowJavaSDK.zip

    谷歌宣布了 Cloud Dataflow,一个批量或实时处理海量数据的服务和 SDK。现在,他们开源了 Dataflow Java SDK,使开发人员可以看到它的实现方式,并合理...谷歌已经创建了一个Stack Overflow标签来回答开发人员的问题。

    JavaScript_一个与Strapi相关的很棒的东西的策划列表.zip

    - **社区链接**:Strapi的官方论坛、GitHub仓库、Stack Overflow标签页等,是获取帮助和支持的重要渠道。 通过这个压缩包,开发者可以获得全面的Strapi学习资源,从基础入门到高级应用,提升使用Strapi开发Web项目...

    pycharm官网及其功能.zip

    - **社区支持**:PyCharm拥有活跃的用户论坛和Stack Overflow标签,用户可以在这里提问、分享经验或寻求帮助。 - **插件市场**:官网提供丰富的插件库,用户可以根据需求安装扩展功能的插件,如GitKraken Globs、...

    PyPI 官网下载 | miller_alaskamoho_srl2018-0.4.3.tar.gz

    这些信息可能在库的GitHub页面、Stack Overflow标签或官方论坛上找到。 为了充分利用这个库,开发者需要阅读其文档,理解其功能和用法,并按照指示进行安装。如果遇到问题,查阅错误日志、搜索在线资源或向社区求助...

    awesome-inferno, 关于Inferno库的精彩收藏.zip

    9. **社区论坛链接**:指向Inferno社区的链接,如GitHub讨论区、Stack Overflow标签等,方便开发者提问和交流。 10. **版本更新历史**:如果包含,这部分会列出自Inferno发布以来的重要更新和改进,有助于开发者...

    很不错的 MobX 相关资源整合.zip

    6. **社区与讨论**: 社区链接指向GitHub问题、论坛、Stack Overflow标签等,方便开发者提问和寻求帮助,以及参与社区讨论。 7. **性能优化**: 由于MobX的自动更新机制,开发者可能需要学习如何避免不必要的计算和...

    解决页面使用overflow: scroll在iOS上滑动卡顿的问题1

    标签“ios”表明问题与苹果的iOS操作系统相关。 在内容部分,开发者提到了一种解决方案,即使用CSS的`-webkit-overflow-scrolling: touch;`属性。这个属性允许iOS设备使用硬件加速来优化滚动性能,从而解决卡顿问题...

    chrome-otto-tabs:智能标签管理

    最重要的是,添加一些Google,Wikipedia Github或Stack Overflow标签,您的浏览器看起来就像一团糟 :face_with_steam_from_nose: 。 需要定期的手动干预才能保持浏览器干净。 这就是为什么我创建了Otto Tabs的原因...

    HTML标签的overflow处理用应

    使用CSS来修饰滚动条 1.overflow内容溢出时的设置 overflow-x水平方向内容溢出时的设置 overflow-y垂直方向内容溢出时的设置 以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。 2.scrollbar-3d-...

    html列表标签

    滚动条是通过div标签实现的,需要添加style属性,设置overflow-x属性为auto,并且可以设置高度和宽度。 超链接 超链接是通过a标签实现的,href属性指定链接的地址。当href属性的值中没有指定协议时,默认使用...

    在android所有版本中显示overflow效果

    标签中提到的`actionbar`和`menu`也是关键概念。`actionbar`是Android应用顶部的区域,用于展示应用的品牌、操作和导航。`menu`则是在Action Bar或Overflow Menu中展示的一系列可选操作。 在`PopupMenuCompat-...

    Stack Overflow小数据集

    对于Stack Overflow的数据集,我们可以预期每个样本至少包含两列:一个问题文本和一个或多个标签,可能还有其他元数据如问题ID、提问时间等。 训练集(train.tsv)是用于模型训练的数据,模型会通过学习这些已标记的...

    标签增加CSS的overflow属性来清除浮动

    在网页制作中,浮动元素(如`<li>`标签)经常被用来实现布局效果,例如创建多列列表或实现响应式设计。然而,浮动元素的一个常见问题是它可能导致其父元素失去高度,即所谓的“浮动塌陷”。为了解决这个问题,我们...

    网页特效代码 鼠标放在连接上强行点击 overflow内容溢出时的设置

    在CSS中,可以使用`overflow`属性来控制内容的溢出方式,比如设置为`auto`显示滚动条,`hidden`隐藏超出部分,或者`scroll`始终显示滚动条。通过合理设置,可以保持页面布局的整洁和可读性。 接下来,"网页中实现...

    个性标签label

    2. **文本溢出处理**:可以通过`text-overflow: ellipsis`来控制超出部分显示省略号,或者使用`overflow: hidden`隐藏超出内容。 3. **最大宽度限制**:为防止标签无限扩大,可以设定一个最大宽度,当内容超过这个...

    javabitset源码-csharpewah:C#中的压缩位图

    标签系统上的工作的一部分: 该库的 Java 对应版本 (JavaEWAH) 是 Apache Hive 及其衍生产品(例如,Apache Spark)和 Eclipse JGit 的一部分。 它已在生产系统中使用多年。 它是主要 Linux 发行版的一部分。 EWAH...

Global site tag (gtag.js) - Google Analytics