css父容器溢出隐藏 子容器溢出滚动
在父容器上设置 overflow: hidden; 可以隐藏溢出的内容。如果你想要在子容器溢出时出现滚动条,可以设置 overflow: auto;。
HTML:
<div class="parent">
<div class="child">
这里是一些可能会溢出的内容...
</div>
</div>
CSS:
.parent {
width: 200px; /* 或者其他固定宽度 */
height: 100px; /* 或者其他固定高度 */
overflow: hidden; /* 隐藏溢出内容 */
}
.child {
width: 300px; /* 超出父容器宽度 */
height: 200px; /* 超出父容器高度 */
overflow: auto; /* 在需要时显示滚动条 */
}
.parent 容器设置了固定的宽度和高度,并且通过 overflow: hidden; 隐藏了溢出的 .child 容器内容。如果 .child 容器的内容确实超出了其设定的宽度和高度,则会显示滚动条,允许用户滚动查看所有内容。