<分区>
我需要在 HTML 中构建一个复杂的表格来安排网络应用程序。 它看起来应该是这样的: http://s7.postimg.org/f3m25bnuj/schedule_layout.jpg
如何在 HTML 中实现此目的？
哪种方法最适合构建这样的表？
“Bootstrap”CSS 框架也能做到这一点吗？
我的表将有超过 12 列
最佳答案
这是一个相当复杂的表格。我建议您使用一些可视化工具(如 Dreamweaver)来绘制此表。通过代码尝试这种复杂的表格是可能的，但它非常耗时并且可能导致可能必须重新检查和重做的错误。 Bootstrap 具有可应用于表格的样式定义，但通过 bootstrap css 尝试此特定表格是可能的，但非常耗时。检查这个 jsfiddle:https://jsfiddle.net/brijeshb/zn9eo7uu/
<table width="80%" border="1" cellspacing="1" cellpadding="2">
<tr>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="14%"> </td>
<td width="5%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="8%"> </td>
<td width="9%"> </td>
</tr>
<tr>
<td rowspan="21"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td> </td>
<td rowspan="10"> </td>
<td> </td>
<td> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td> </td>
<td> </td>
<td> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td> </td>
<td rowspan="5"> </td>
<td> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
<td rowspan="5"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
关于html - 最佳方法，构建复杂的 HTML 表格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30685486/
相关文章：
jquery - 如何切换显示以显示在 if-else 语句中？
javascript - 方法在第二次运行时调用两次 - JavaScript
javascript - 从 google 工作表中提取数据并显示为简单的 html 文本
javascript - 为什么当我淡入时淡出的 div 不回来？
javascript - Bootstrap markdown 预览表
javascript - Scrollspy 不工作 - Bootstrap 4 Beta
javascript - 带有子菜单的 Bootstrap 导航栏 - 如何删除 768 下的类 "disabled"@media width