Question

我试图在同一条线上显示多个图像而不会缩小。我已经尝试过我所知道的所有事情，但没有运气！我正在尝试为幻灯片制作一个图像选择器，它将使用ajax / jQuery加载到页面中，我不希望它占用大量的屏幕房地产。理想情况下，我希望能够水平滚动并选择我的图像。

<script type="text/javascript">     
    $(document).ready(function () {
      test();
    });     

    function test(){
      for (var i=0; i < images.length; i++) {
        $("#test").append("<img src='"+images[i]+"' style='width:250px; height: 250px; margin:10px; display:inline'/>");
      };
    } 
</script>
<div id="test"></div>

通常我对HTML有0个问题所以我觉得有点愚蠢的问题，我确信这是一个非常简单的错误。任何帮助将不胜感激！

Answer 1

尝试将nowrap应用于div＃test：

#test{ white-space:nowrap; }

你可能还需要另一个包含div＃test的包装器，包含overflow：auto;那么如果你想要水平滚动。

Answer 2

尝试浮动：在图像中左侧或尝试将图像包装在div中，然后尝试浮动：左

Answer 3

在float:left标记样式中尝试<img>。如果没有帮助，请尝试将display:inline更改为display:inline-block。

Answer 4

在图片上尝试float:left 而且我发现你还没有声明图像数组（希望你的原始代码中有）

问题内联显示图像

4 个答案: