div底部可以看到白色背景，可以修复吗？
.flexbox-item_one {
display: inline-block;
width: 200px;
margin: 10px;
background-color: white;
box-shadow: 5px 5px 5px;
overflow: hidden;
}
.flexbox-item-1 {
min-height: 300px;
min-width: 300px;
border: 3px solid red;
overflow: hidden;
}
#Aries_pic_1 {
height: 300px;
width: 300px;
inline-size: 100%;
object-fit: cover;
}<html>
<div class="flexbox-container">
<div class="flexbox-item_one flexbox-item-1">
<div> <a href="Aries_page.html" class="Get_1" target="_blank">
<img src="https://cf.ltkcdn.net/horoscopes/images/orig/239601-1600x1030-aries-
constellation.jpg " id="Aries_pic_1">
</a>
</div>
</div>
</html>回答1
在设置样式时，在 img 上添加 display:block 将解决问题。像这样：
.flexbox-item_one {
display: inline-block;
width: 200px;
margin: 10px;
background-color: white;
box-shadow: 5px 5px 5px;
overflow: hidden;
}
.flexbox-item-1 {
min-height: 300px;
min-width: 300px;
border: 3px solid red;
overflow: hidden;
}
#Aries_pic_1 {
height: 300px;
width: 300px;
inline-size: 100%;
object-fit: cover;
display: block; /* line I added */
}<div class="flexbox-container">
<div class="flexbox-item_one flexbox-item-1">
<div>
<a href="Aries_page.html" class="Get_1" target="_blank">
<img
src="https://images.unsplash.com/photo-1648737155328-0c0012cf2f20?ixlib=rb-1.2.1&ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&auto=format&fit=crop&w=500&q=60"
id="Aries_pic_1"
/>
</a>
</div>
</div>
</div>回答2
我会为此使用 flex 。
看到您在 flexbox-item-1 上应用了 min-width 和 min-height，我怀疑您希望对图像进行响应式大小调整 - 为此使用固定的 values 不会让您这样做。
容器元素上的 display: flex 将自动使第二个容器 div 占用剩余空间，以及 a 元素。应用 max-width: 100% 确保 img 永远不会溢出容器。应用 height: 100% 和 object-fit: cover ，瞧，你得到了一个完全响应的容器，里面有一个 img 元素。
.flexbox-item_one {
display: inline-block;
width: 200px;
margin: 10px;
background-color: white;
box-shadow: 5px 5px 5px;
overflow: hidden;
}
.flexbox-item-1 {
min-height: 300px;
min-width: 300px;
border: 3px solid red;
overflow: hidden;
display: flex;
}
#Aries_pic_1 {
max-width: 100%;
height: 100%;
object-fit: cover;
}<html>
<div class="flexbox-container">
<div class="flexbox-item_one flexbox-item-1">
<div>
<a href="Aries_page.html" class="Get_1" target="_blank">
<img src="https://www.fillmurray.com/640/360" id="Aries_pic_1">
</a>
</div>
</div>
</html>