我的网页中间有一个标题区域。然后元素是标题的一部分。有人可以解释溢出的内容:隐藏;在这里。我不明白为什么我需要它或它做什么。
谢谢,
#hdr_mdl {
margin: 0 auto;
overflow: hidden;
width: 980px;
z-index: 10;
height: 50px;
}
答案 0 :(得分:5)
overflow:hidden
可防止滚动条显示,即使它们是必要的。
CSS的解释:
margin: 0 auto
水平对齐中心的元素overflow:hidden
阻止滚动条显示width:980px
将元素的宽度设置为980px
。z-index:10
会导致元素停留在元素之上而没有定义的z-index
,*或 - 元素,其中z-index
低于10,或元素a z-index
为10,但在当前元素之前定义heigh:50px
- 身高50px
。答案 1 :(得分:0)
如果#hdrPmdl中的内容溢出超过50px,则不允许浏览器将滚动条插入DIV。如果DIV不包含动态内容并且大小将始终保持静态,那么可能不需要它,因为内容不会是> 50像素
答案 2 :(得分:0)
overflow
属性的说明:CSS overflow Property
overflow
属性的互动示例:Play it
答案 3 :(得分:0)
overflow
指定当内容更大而不是块尺寸时,浏览器应该执行的操作。 overflow:hidden
表示“隐藏它并保留初始块尺寸”。
答案 4 :(得分:0)
如果您对特定内容使用隐藏溢出而不是为此内容剪切溢出,则其余内容将不可见。为了清楚这件事,请访问w3school http://www.w3schools.com/cssref/pr_pos_overflow.asp
答案 5 :(得分:0)
当 overflow: hidden
添加到容器元素时,它会隐藏不适合容器的子元素。
示例:
.overflowhidden {
background: green;
width: 10rem;
height: 10rem;
overflow: hidden;
}
<div class="overflowhidden">
This container has the style overflow:hidden. Text that does not fit becomes hidden. This is a very long sentence of text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text even more text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text this is the end of the sentence.
</div>