使用 HTML 绘制图表（如组织结构图）时如何维护 HTML 语义

Question

我在网页上使用 ASP.NET 创建了一个组织结构图。该网页使用严格的 DOCTYPE 并遵循 W3C 标准。

图表的层次结构由包含组织中员工的表中的经理字段决定。

图表布局具有包含员工图像和其他详细信息（如职位、部门和联系方式）的节点。节点排列精美，并由线条连接（仅水平或垂直或两者兼有）。

很多 DIV 元素用于连接线和正确排列图表（以避免表格）。正如我朋友所建议的，使用 DIV 连接图表中的线条在语义上是错误的。另外，很多DIV用于排列图表。

有没有一种方法可以使它在语义上正确？或者，我是否将 HTML 用于错误的目的？

Answer 1

看起来您正在将 HTML 用于您不应该做的事情。话虽如此，DIV 应该用于文档的划分（部分）。如果每个节点在概念上都是一个单元，那么 DIV 可能是合适的。如果节点不是一个单元，您可能希望使用 SPAN。