960 网格系统中的重叠网格

发布于 2024-09-08 08:10:38 字数 138 浏览 4 评论 0原文

例如,在 12 列网格中,我想要一个 9 网格宽和另一个 4 网格宽。 div 的中间会有 1 个网格宽的重叠。这对于一些奇特的效果很有用。

当然,我可以只使用一个 div,然后相应地在其中创建更多 div(不使用网格系统),但是有更好的方法吗?

For example, in a 12-column grid, I want to have a 9-grid-wide and another 4-grid-wide . The divs will have an overlap 1 grid wide in the middle. This is useful for some fancy effects.

Of course I can just use one div and then create more divs inside accordingly (not using the Grid System), but is there a better way?

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

扫码二维码加入Web技术交流群

发布评论

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

评论(2

孤独陪着我 2024-09-15 08:10:38

或者,您可以使用所有自定义 DIV 自行组织布局,只需遵循 960GS 为您提供的指南即可。没有任何内容告诉您必须使用预制的 HTML 模板才能从网格系统的概念中受益。它只是作为指导,确保页面上的所有宽度看起来都很好并且适合在一起。

Or you could organize your layout by yourself with all custom DIVs, that just follows the guidelines the 960GS gives you. There's nothing that tells you that you have to use the premade HTML template to benefit from the concept of the grid system. It's just there as a guide to make sure all widths on the page look good and fit together.

真心难拥有 2024-09-15 08:10:38

我相信网格 CSS 系统的设计是为了实现快速、简单的无表格布局。它们不是为这种事情而设计的。但是,您可能会对一个第三方工具感兴趣。您可以在这里找到它: http://gridder.andreehansson.se/

不过,您可能会发现更容易只需使用 CSS 来布局 DIV 元素,使用负边距重叠它们,并使用 z-index 属性来确定哪个重叠的 DIV 元素应位于顶部。

I believe that grid CSS systems were designed to enable quick and easy table-less layouts. They were not designed for this kind of thing. However, there is a third party tool that may interest you. You can find it here: http://gridder.andreehansson.se/

You may however find it easier to just use CSS to layout your DIV elements, overlap them using negative margins and use the z-index property to determine which of the overlapped DIV elements should be on top.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文