Question

我正在尝试让我的DIV只显示水平滚动条。我用大量图像填充DIV，只希望用户能够水平滚动。

但我有两个问题：

我读过的一个教程给了我一些代码（我不再拥有），它会显示滚动条。但事实并非如此。它还使图像显示在彼此之下。所以我废弃了那段代码。

另一个教程给了我想要的'外观'，但没有滚动条。但滚动条应该出现了！

我如何拥有DIV，充满图片和水平滚动条？

这是我到目前为止所拥有的：

CSS：（dude.css）

.EditorialImagePaneOne
{
    width: 500px

    -ms-overflow-x:scroll;
      overflow-x:scroll;
    white-space:nowrap;

}

.ShowcaseImage
{
    height: 407px;
}

HTML：（Index.html）

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
    <link rel="stylesheet" href="../Assets/CSS/dude.css" />
        <title></title>
    </head>
    <body>

    <div class="EditorialImagePaneOne">
        <img src="../Assets/Images/Editorial/1-1.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-2.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-3.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-4.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-5.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-6.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-7.jpg" class="ShowcaseImage" />
        <img src="../Assets/Images/Editorial/1-8.jpg" class="ShowcaseImage" />
    </div>
    </body>
</html>

Answer 1

也许您会错过页面中DOCTYPE之类的内容。请确保将此作为代码中的第一行，位于<html>行之上：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

DIV不显示水平滚动条

1 个答案: