Question

好的，所以这个问题更多的是一种“最好的方法”＃34;或者我做错了。

此时我一直在为多个项目使用网格系统，而且我在appraoches中如何构建总体布局。两个似乎工作正常，我只是想知道哪一个在逻辑上更有意义。

所以我们说我的应用程序左侧有一个侧边栏，右侧有一个内容区域。

我一直在做这个或那样的方式

一个。

<div class="container">
 <div class="grid_4 sidebar"></div>
 <div class"grid_8 content"></div>
</div>

乙

<div class="container">
 <div class="grid_12 wrap">
  <div class="grid_4 sidebar alpha"></div>
  <div class"grid_8 content omega"></div>
 </div>
</div>

我的问题是更好的方法和原因。

Answer 1

我会选择 A ，至少这是JQuery Mobile处理网格的方式。

JQuery Mobile Grids

Answer 2

A 对简单页面最有意义。

实质上， B <div class="grid_12 wrap"></div>只是第二个容器。如果您的内容之上或之下的内容仍然在您的容器<div>中，那么这可能是有意义的。它允许你包含＆＃34;网格区域但仍保留容器内的所有内容。

如果这是您的整个网格，那么您最好使用更简单的标记。当您的代码更长或更复杂时， A 将更容易追踪问题。我无法计算我已经丢失了嵌套<div></div>标记的次数，尤其是在记事本/文本编辑器中工作或者我的标记在编辑编辑器中没有清除时。

网格布局的最佳方法

2 个答案: