我想得到一些建议/解决方案和方法，关于如何添加一个水平滚动的单行图像列表.假设您有一个包含多个div元素的html页面，并且该页面是可垂直滚动的.在页面的最后一行，我想显示一个可以水平滚动的图像列表.如何才能达到这一效果呢？请参考下图.红线框是Reaction js中显示图像列表的组件.
我想得到一些建议/解决方案和方法，关于如何添加一个水平滚动的单行图像列表.假设您有一个包含多个div元素的html页面，并且该页面是可垂直滚动的.在页面的最后一行，我想显示一个可以水平滚动的图像列表.如何才能达到这一效果呢？请参考下图.红线框是Reaction js中显示图像列表的组件.
如果你想用普通的html和css来做这件事，你可以试试这个，如果你想在reaction中做这件事，那么Check out this.
div.scrollmenu {
background-color: #333;
overflow: auto;
white-space: nowrap;
}
div.scrollmenu div {
display: inline-block;
color: white;
text-align: center;
padding: 14px;
text-decoration: none;
}
div.scrollmenu div:hover {
background-color: #777;
}
img {
width: 100px;
height: 100px;
}<div class="scrollmenu">
<div class="#home">
<img src="https://images.unsplash.com/photo-1615463738213-b9381d217b4e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1332&q=80">
</div>
<div class="#news"><img src="https://images.unsplash.com/photo-1578301978018-3005759f48f7?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1144&q=80"></div>
<div class="#contact"><img src="https://images.unsplash.com/photo-1506744038136-46273834b3fb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1170&q=80"></div>
<div class="#about"><img src="https://images.unsplash.com/photo-1581337204873-ef36aa186caa?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1156&q=80"></div>
<div class="#about"><img src="https://images.unsplash.com/photo-1581337204873-ef36aa186caa?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1156&q=80"></div>
<div class="#about"><img src="https://images.unsplash.com/photo-1581337204873-ef36aa186caa?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1156&q=80"></div>
</div>