当前位置：文江博客话题详情

如何为应用程序屏幕截图创建一个漂亮的水平滚动区域，就像 iTunes 上的应用程序一样？

发布于 2024-12-18 01:11:35 字数 110 浏览 1 评论 0原文

我想将一些应用程序屏幕截图添加到我的网站，但我想将它们放在水平滚动区域中，就像 iTunes Store 应用程序屏幕截图区域一样。

我该如何实现这一点，或者有人可以指出我正确的方向。谢谢。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

也只是曾经 2024-12-25 01:11:35

<div style="width: 800px; height: 100px; overflow: auto">
   <div style="height: 100px">
      ... lots of content here ...
   </div>
</div>

只要您将“内容”设置为水平流动，一旦内部 div 宽度超过 800px 并“溢出”外部 div，它就会创建一个水平滚动条。

<div style="width: 800px; height: 100px; overflow: auto">
   <div style="height: 100px">
      ... lots of content here ...
   </div>
</div>

as long as you style the "content" so it flows horizontally, it'll create a horizontal scrollbar once the inner div grows wider than 800px and "overflows" the outer div.

回复收藏 0 原文

ゃ人海孤独症 2024-12-25 01:11:35

以此作为 CSS 创建一个 DIV：

.overflowdiv {
    height: 310px;
    overflow-x: auto;
    overflow-y: hidden;
    width: 980px;
}

这将创建一个具有自动溢出功能的 980x310px div，因此如果内容比像素数量宽，它将自动添加滚动条。

为了防止出现“新行”，我通常在其中添加一个表：

<div class="overflowdiv">
<table>
    <tr>
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
    </tr>
</table>

Create a DIV with this as CSS:

.overflowdiv {
    height: 310px;
    overflow-x: auto;
    overflow-y: hidden;
    width: 980px;
}

This will create a 980x310px div with an auto overflow so it will automatically add a scroll if the content is wider than the amount of pixels.

To prevent 'new lines' from happening, I usually add a table in it:

<div class="overflowdiv">
<table>
    <tr>
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
        <td>
            Content here
        </td>      
    </tr>
</table>

回复收藏 0 原文

~没有更多了~