Overflow-为多余的字体添加滚动条——HTML5基础教程 前段大G > 首页 > 网站公告 >
CSS Overflow
CSS overflow 属性可以控制内容溢出元素框时在对应的元素区间内添加滚动条。
overflow属性有以下值：
|
值 |
描述 |
|
visible |
默认值。内容不会被修剪，会呈现在元素框之外。 |
|
hidden |
内容会被修剪，并且其余内容是不可见的。 |
|
scroll |
内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 |
|
auto |
如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。 |
|
inherit |
规定应该从父元素继承 overflow 属性的值。 |
注意:overflow 属性只工作于指定高度的块元素上。
注意: 在 OS X Lion ( Mac 系统) 系统上，滚动条默认是隐藏的，使用的时候才会显示 (设置 "overflow:scroll" 也是一样的)。
overflow: visible
默认情况下，overflow 的值为 visible， 意思是内容溢出元素框：
实例
div { width: 200px; height: 50px; background-color: #eee; overflow: visible; }
overflow: hideen
文本溢出对话框之后自动消失，框内文字减少时，自动补上
实例
div { width: 200px; height: 50px; background-color: #eee; overflow: hideen; }
overflow: scroll
文本溢出对话框之后字体不会真正消失会隐藏起来，滚动条滑动之后 会显示下面的字体
实例
div { width: 200px; height: 50px; background-color: #eee; overflow: scroll; }
overflow: auto
文本溢出对话框之后字体不会消失下拉滚动条就可以看见
实例
div { width: 200px; height: 50px; background-color: #eee; overflow: auto; }
overflow: inherit
该样式继承父元素，父元素什么样子子元素和父元素相同， 我这里没有加父元素，所以看起来和第一个没有差别
实例
div { width: 200px; height: 50px; background-color: #eee; overflow: inherit; }
这篇Overflow-为多余的字体添加滚动条——HTML5基础教程，文章就结束了，有不懂的地方可以联系站长。希望每个前端人员都有可以找到一个好工作，谢谢观看，祝您生活愉快。
2023-11-21 15:01
文章点击量：
作者：【前端大G】
文章标签：
HTML,教程,CSS,布局,Overflow-,为,多余,
