使用jQuery&；引导程序3

我正在尝试使用jQuery和Bootstrap创建门户/仪表板。我需要能够显示具有固定尺寸的小工具，这些小工具可以一起显示在同一页面上。我为用户提供了为每个页面定义模板的能力，该模板定义了可以在页面上显示的小工具的尺寸以及它们的布局

我已经可以做一个基本的非响应式仪表板了，但让我困惑的是，我想让仪表板响应。如果这些小工具都是相似的大小，按照Bootstrap的网格系统组织成行，这将是相当容易的

我想最好的例子就是我在网上找到的这个截图

第一个小工具跨越两行，下两个小工具仅跨越一行。我不知道如何使用Bootstrap的网格系统来实现这一点

或者，它是否应该做出响应？如果仪表板没有响应能力，是否会带来更好的用户体验

---

编辑：我确实有使用平板电脑和/或手机的客户。

当您在小屏幕上工作时，响应能力总是一个优势。因此，如果你有小屏幕的客户，例如电话、平板电脑、旧的scool显示器，那么是的，保持响应是个好主意

对于网格系统问题。尝试将小部件分组，使其适合一行。例如，表格和两个饼图是在一行中的完美候选。然后，它们的

tad中的饼图应该在单独的行中，依此类推

您可以嵌套任意多行

---

一行跨越父对象的所有12列。因此，表格和饼图应采用不同的

s格式，以便在没有空间容纳内容时让内容“掉下来”。

我在中为您找到了一个很好的起点。这是一个使用引导网格系统构建的仪表板。您可以使用在前端开发人员中非常流行的图表控件向图表控件添加响应性。

仅供参考，我还使用创建了一个简单的仪表板，我正在查看是否可以忽略响应性方面，并使用现有库提供专业仪表板。谢谢大家。我想我会回来发布更新。这种设计不适合我的需要，所以我设计了仪表板，让用户调整大小和移动小工具。我想最终结果并不是一个真正的仪表板，但它工作得很好，因为用户可以为台式机、手机和平板电脑创建单独的页面。仪表板不再使用模板指定页面布局。对我的用户来说，这实在是太麻烦了。谢谢