html - 出现但未出现在 div 中的图像

Question

我的图片出现了，但似乎没有占用 div 中的任何空间。

这是我的 html:

<div id="header">

    <img id="img_1" src="img/DSC_0195.JPG" alt="Habor 1">
    <img class="img_2-5" src="img/DSC_0197.JPG" alt="Habor 2">
    <img class="img_2-5" src="img/DSC_0904.JPG" alt="Habor 3">
    <img class="img_2-5" src="img/DSC_0901.JPG" alt="Habor 4">
    <img class="img_2-5" src="img/DSC_0903.JPG" alt="Habor 5">
    <img id="img_6" src="img/DSC_0902.JPG" alt="Habor 6">               
</div>

和我的CSS:

#header {
    margin:0 auto;
    width: 100%;
}

.img_2-5, #img_1, #img_6{
    width:16.666%;
    display: inline;
    float:left;
}

#img_1 {
    border-radius: 25px 0 0 25px;   
}

#img_6{
    border-radius: 0 25px 25px 0;       
}

Answer 1

这是因为您的图像是 float 的。您需要在父级上添加一个 overflow:hidden; 属性，使它们出现在 div 上。