给定一个 HTML 页面，该页面具有复杂的基于表格的布局和许多重复且浪费的标签，例如:
td align="left" class="tableformat" width="65%" style="border-bottom:1px solid #ff9600; border-right:1px solid #ff9600; background-color:#FDD69E" nowrap etc.
是否有工具可以帮助将页面重构为更紧凑的形式？例如，自动生成 CSS 样式和选择器的工具？将表格转换为 div 布局？
只是为了说明问题的顺序，我正在查看的页面有 >8000 行 HTML 和 JavaScript，即 500Kb 不计算 图片!
更新:关于。 “放弃，从头开始”的评论。在现实世界中，这意味着什么？打印出页面，扫描它，在 Dreamweaver 中将其设置为背景图像，然后从那里开始？严重地？这真的比重构更有效吗？
更新:我不是在贬低“从头开始跟踪它”，也不是要暗示 Dreamweaver 无论如何都是我的首选工具。我只是很惊讶重构布局被认为是一个棘手的问题。
最佳答案
我同意 TimB因为自动化工具在执行此操作时会遇到麻烦，特别是进行关系跳转以最有效的方式组合和抽象 CSS。
如果您要呈现表格数据，尝试将内联 CSS 重构为可重用类可能是合理的。
如果您有很多具有内联样式的相似表格，您可以通过简单的搜索和替换逐渐重构 CSS。 这将为您提供许多与相似表的子集匹配的类和许多有点相似的类。 将其分解为布局和演示将是一个好的开始，然后用每个主题或语义相关元素的特定类覆盖它们。
我仍然建议从头开始，它可能会更快，并且您可以只重新创建呈现页面所需的内容，并且可以在以后重用元素或元素集合.
如果页面需要再次修改，所花费的时间也会显着得到返回。
但这一点也不可能吧？ :D
关于html - 将基于表格的 HTML 布局重构为 CSS 的工具？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/151369/