`
robinqu
  • 浏览: 88723 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

Overflow属性

    博客分类:
  • css
阅读更多
引用
overflow

Values:
visible | hidden | scroll | auto | inherit

Initial value:
visible

Applies to:
Block-level and replaced elements

Inherited:
No

Computed value:
As specified


If scroll is used, the panning mechanisms (e.g., scrollbars) should always be rendered. To quote the specification, "this avoids any problem with scrollbars appearing or disappearing in a dynamic environment." Thus, even if the element has sufficient space to display all of its content, the scrollbars should still appear. In addition, when printing a page or otherwise displaying the document in a print medium, the content may be displayed as though the value of overflow were
declared as visible.

Scroll 意味着滚动条始终被显示,那么就可以避免在动态文本的容器中滚动条显示、出现造成的种种问题。当在打印介质中,Scroll会默认编程visible,即自动溢出。

If overflow is set to hidden, the element's content is clipped at the edges of the element box, but no scrolling interface should be provided to make the content outside the clipping region accessible to the user.

hidden代表隐藏超出高度的部分

Finally, there is overflow: auto. This allows user agents to determine which behavior to use, although they are encouraged to provide a scrolling mechanism when necessary. This is a potentially useful way to use overflow since user agents could interpret it as "provide scrollbars only when needed." (They may not, but they certainly could and probably should.)

auto是让浏览器自动选择是否显示滚动条


来自CSS Definitive Guide
分享到:
评论

相关推荐

    详解CSS3:overflow属性

    overflow为溢出(容器),当内容超出容器时只需添加overflow属性值为hidden, 就可以把超出容器的部分隐藏起来; 如果内容超出容器却又不想其隐藏时可以将其属性值设置为auto; overflow:auto 属性如果超出就出现...

    css使用overflow属性控制滚动条的样式

    滚动条样式主要涉及到如下overflow属性: overflow属性: 检索或设置当对象的内容超过其指定高度及宽度时如何显示内容,其用到的表现形式和值有以下几种 overflow: auto; 在需要时内容会自动添加滚动条 overflow: ...

    overflow属性的使用小例子

    使用overflow的属性,来控制溢出的内容,效果可以自己试试看

    用margin和overflow属性实现div间距的方法

    用margin和overflow属性实现div间距的方法

    美工之路 网页设计视频教程CSS篇-33.盒子Box:overflow属性.rar

    美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...

    css中text-overflow属性与文本截断详解

    主要给大家介绍了关于css中text-overflow属性与文本截断的相关资料,文中给出了详细的示例代码供大家参考学习,希望本文的内容对各位前端开发者们能带一定的帮助,需要的朋友们下面跟着小编一起来学习学习吧。

    使用HTML开发商业网站-DIV+CSS布局 布局的其他属性课件.pptx

    overflow属性可以解决溢出问题,其基本语法格式如下: 选择器{overflow:属性值;} overflow属性的常用值有四个,具体如下表所示。 属性值 描述 visible 内容不会被修剪,会呈现在元素框之外(默认值) hidden 溢出...

    使用CSS的overflow属性防止float撑开div的方法

    我们在使用float设定浮动元素的时候经常会遇到撑破div的情况,其中一种解决方法即是利用overflow: hidden,这里我们就来看一下使用CSS的overflow属性防止float撑开div的方法:

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

    方法真的很简单,只要为需要清浮动的标签加上overflow这个属性。 ul{ list-style:none; height:auto; margin:0;p adding:0; background-color:#436973; } li{ float:left; width:80px; height:80px; background-...

    CSS属性探秘系列(二):overflow及相关属性text-overflow

    一、overflow指定盒中...3.说明:对于table来说,假如table-layout属性设置为fixed,则td对象支持带有默认值为hidden的overflow属性。如果设为hidden,scroll或者auto,那么超出td尺寸的内容将被剪切。如果设为visible

    CSS控制文本的长度 超过一行显示省略号的实现方法

    text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏

    全面阐述overflowhidden属性

    css中overflow:hidden CSS样式可以隐藏溢出的部分 好处就是可以防止网页变形

    使用text-overflow:ellipsis实现溢出文本省略号显示无需js

    发现除了设置 text-overflow 属性为 ellipsis 外 还需要设置 white-space 属性为 nowrap (限制不换行) 和 overflow 属性为 hidden (隐藏溢出) 即设置样式 style="text-overflow:ellipsis; white-space: ...

    CSS基础-实验楼.md

    我们使用 overflow 属性来控制这种情况的发生。常用的值: - auto:当内容过多的时候溢流的内容被隐藏,然后出现滚动条,让我们滚动查看所有的内容。 - hidden: 当内容过多,溢流的内容被隐藏。 - visible: 当...

    细说CSS3中box属性中的overflow-x属性和overflow-y属性值的效果

    大家可以发现,上网站上查询之后会得到overflow-x和overflow-y的一大堆属性值,但很多网站并没有详细说明各属性值的效果,我们今天细说一下。 各属性值如下: visible:默认值,不裁剪内容,可能会显示在内容框...

    深入理解CSS overflow:hidden——溢出,坍塌,清除浮动

    overflow:hidden是overflow属性的一个神奇用法,它可以帮助我们隐藏溢出的元素,清除浮动和解除坍塌。当某一个属性拥有这么多的功能时,难免使人难以把握,不过不要怕,只要信:看完这篇文章,我相信你绝对能对...

Global site tag (gtag.js) - Google Analytics