javascript - 问题显示内联图像

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>

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

Answer 1

尝试将 nowrap 应用于 div#test:

#test{ white-space:nowrap; } 

您可能还需要使用 overflow:auto 对 div#test 进行另一个包装；那么如果你想要水平滚动。