javascript - 如果“它们不适合”，如何使图像填充 100% 的 div

Question

我有多个图像（50x50），我的网站宽度是 980 像素

我想用图像填充一行，没有任何间隙。但是如果没有你的任何 CSS/JS/帮助，第 20 张图像最终会出现在第二行。

如何显示第 20 张图像中的 40%？

Answer 1

在你的containerdiv 上：

#container{
    overflow:hidden; /* Hide the overflow */
}

Answer 2

我自己找到了解决方案。

使用 CSS 显示较短的宽度：

<?php
    $img = "";
    $width = 50;
    for($i=0;$i<20;$i++) {
        if($i == 19) {
            $width = 30;
        }
?>
<img src="<?=$img;>" style="width: <?=$width;?>px; height:50px;" />
<?php
    }
?>

Answer 3

img:nth-child(20n) { width:30px; }