html表格的对齐格式化,如何通过预格式化文本来对齐HTML表格？-优快云博客

博主在尝试创建一个显示吉他指板的HTML页面，遇到表格与`pre`元素对齐的难题。他们希望表格能与`pre`块中的音品标记对齐，但目前无法实现。博客内容详细描述了代码布局和期望的效果，并附上了当前的显示截图。博主正在寻求帮助以获得美观的指板图布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我试图创建一个使用pre块与table对齐的吉他脖子的HTML页面。我需要桌子完美排列，所以我可以在每个音品上写下笔记，但由于某种原因，无论我做什么，我的table都不会排列在pre元素上。如何通过预格式化文本来对齐HTML表格？

代码：

Test

────────┼┼─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫

││ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║

────────┼┼─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫────●────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫─────────╫────●────╫

││ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║

││ ║ ║ ● ║ ║ ● ║ ║ ● ║ ║ ● ║ ║ ║ ║ ║ ║ ● ║ ║ ● ║ ║ ● ║ ║ ● ║ ║ ║ ║

││ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║