当我在下面找到此代码示例时，我只是在w3schools上查看html / css。我想知道为什么它只在ul具有“ overflow：hidden;”的情况下才显示列表，因为隐藏的溢出定义是：溢出被裁剪，其余内容将不可见
谢谢你的每一个回答:)
<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 16px;
text-decoration: none;
}
li a:hover {
background-color: #111111;
}
</style>
</head>
<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</body>
</html>举例来说：
以下div中的图像将浮动。第一div的属性为overflow:hidden;。结果可以看出，第一个div将通过调整大小来简化内容，但是第二个div仍然处于折叠状态。float属性有一种将元素从文档流中移出的方法，但可以将其overflow:hidden;还原。似乎有点反常。
#div1, #div2 {
border: 2px solid green;
margin-bottom:5px;
}
img {
float:left;
}
#div1 {
overflow:hidden;
}<div id="div1">
<img src="http://placehold.it/200x100"></div>
<div id="div2">
<img src="http://placehold.it/200x100"></div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句