使用DIV的内部布局设计

时间：2014-11-12 07:04:35

标签： php html css

我需要使用DIV创建页面布局。我可以创建基本布局，但这个有点复杂，请参见附加的布局。这可能吗？任何指示我正确方向的帮助将不胜感激...... enter image description here

2 个答案:

答案 0 :(得分：1)

我认为有两种解决方案：

1你可以使用像Bootstrap这样的网格系统，你也可以在其他地方浮动内部div，

2如果高度很重要或者在所有内部div上都是可选的，你可以通过将相同大小的div合并在一起来使用一些解决方法。在你的布局中，我会尝试：

  • 创建4＆＃34;主要div＆＃34;对于内部div 1到11，以及最后三个12,13和14
  • 在第一个主div中，创建一个左浮动和固定宽度的内部div 1,3和10
  • 让div 2保持原样，但边距留在步骤2中创建的div的宽度
  • 创建另一个div，如＃2，但内部div为4到8
  • 对div 9和11重复步骤3

  • 在创建的div中为4到8，它与第一个相同，只是在一个div中合并4和5，在另一个div中合并6,7和8 - 不要忘记宽度和浮动< /强>

  • 确保你总是清除div之后的浮动，例如第一个主要到第二个和合并的

  • 如果您想在整个布局上使用固定宽度，请在其周围放置一个包装或将所有4个主要div设置为固定宽度

-untestet-但解决方案2 适用于我的许多布局，你也可以添加响应支持，但bootstrap本身已经响应。选择你自己。

答案 1 :(得分：0)

您可以使用float:left和float:right，text-align: center以及响应式布局的百分比宽度

相关问题
最新问题