父元素中子元素两行排列，超出部分隐藏
为了让父元素中的子元素两行排列，超出部分隐藏，可以使用以下方法：
- 设置父元素宽度和高度：给父元素定义明确的宽度和高度，以控制子元素的显示区域。
- 使用 flexbox：使用 css 的 flexbox 布局，将子元素设置为 flex-wrap: wrap;，使其超出父元素宽度时自动换行。
- 隐藏超出部分：使用 overflow: hidden; 隐藏超出父元素的部分。
- 添加省略号按钮：在父元素外部添加一个按钮，用于显示隐藏的部分。
- javascript 监听按钮点击：使用 javascript 监听省略号按钮的点击事件，当点击时解除隐藏并显示滚动条。
#container {
width: 400px;
height: 200px;
border: 1px solid red;
overflow: hidden;
}
#flex-container {
display: flex;
flex-wrap: wrap;
}
.item {
width: 100px;
height: 100px;
background: #ccc;
}
#more {
display: none;
position: absolute;
top: 180px;
right: 10px;
}const moreButton = document.getElementById('more');
const container = document.getElementById('container');
const flexContainer = document.getElementById('flex-container');
moreButton.addEventListener('click', () => {
moreButton.style.display = 'none';
container.style.overflow = 'scroll';
});
// 当子元素超出父元素时显示省略号按钮
if (flexContainer.offsetWidth > container.offsetWidth) {
moreButton.style.display = 'block';
} 
