不推荐用 做导航栏，因其语义错误（导航非表格数据）、可访问性差（屏幕阅读器误读为行数据）、维护困难；应改用语义化 + 结构，配合 css 实现垂直布局与响应式交互。
用 <table> 做导航栏本身就是个危险信号
<p>不推荐用 <code><table> 实现导航栏，哪怕只是想让链接垂直<a style="color:#f60; text-decoration:underline;" title="排列" href="https://m.php.cn/zt/56129.html" target="_blank">排列</a>。语义上，导航是页面结构的一部分，不是数据表格；可访问性上，屏幕阅读器会把 <code><tr> 当作行数据处理，导致“首页、关于、联系”被读成“一行包含三个单元格”，而非“三个独立导航项”；维护上，加 hover 效果、响应式折叠、焦点管理都会比标准方案更绕。
<h3><code><tr> 垂直排列链接？别硬套表格逻辑
<p>如果非要用 <code><table>（比如遗留系统受限），想让每个 <code><a></a> 占一行，本质是让每个链接独占一个 <tr>，而不是塞进同一行的多个 <code><td>：
<pre class="brush:php;toolbar:false;"></pre>
<table>
<tr><td><a href="/">首页</a></td></tr>
<tr><td><a href="/about">关于</a></td></tr>
<tr><td><a href="/contact">联系</a></td></tr>
</table>
<ul><li>每个 <code><tr> 包一个 <code><td>，自然垂直堆叠
<li>必须显式清空默认边框和间距：<code>border="0" cellspacing="0" cellpadding="0"，否则会有讨厌的间隙和边线
<td> 默认是 <code>display: table-cell，垂直对齐受 vertical-align 影响，若文字上下偏移，要设 vertical-align: top
真正该用什么替代 <table> 导航？
<p>用语义化标签 + CSS 控制布局，既简洁又健壮：</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill9263" title="Html2md"><img
src="https://img.php.cn/upload/skill/000/000/081/179249945220127.jpg" alt="Html2md" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill9263" title="Html2md" class="overflowclass">Html2md</a>
<p class="overflowclass">使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...</p>
</div>
<a rel="nofollow" href="/xiazai/skill9263" title="Html2md" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<pre class="brush:php;toolbar:false;"><nav><ul style="list-style: none; margin: 0; padding: 0;">
<li style="margin-bottom: 0.5em;"><a href="/">首页</a></li>
<li style="margin-bottom: 0.5em;"><a href="/about">关于</a></li>
<li><a href="/contact">联系</a></li>
</ul></nav></pre>
<ul>
<li>
<code><nav></nav> 明确告诉浏览器这是导航区域，支持键盘聚焦、ARIA 自动识别
<ul></ul> 表达“一组相关链接”，比 <div> 更准确
<li>纯 CSS 控制垂直流：靠 <code>margin-bottom 或 flex-direction: column，无兼容性包袱如果必须兼容老 IE（IE8 及以下）怎么办？
老 IE 对 <nav></nav> 和现代 display 值支持差，但也不必退回到 <table>：
<ul><li>用 <code><div role="navigation"> 替代 <code><nav></nav>，保可访问性
display: block 强制链接换行，而非依赖 flex/gridinline-block 的空白符问题：把 <li> 标签写在同一行，或设 font-size: 0 在父容器再重置子元素字号表格的 <tr> 是为行数据设计的，不是布局工具。哪怕只改一行 CSS，也比用错语义多出三处潜在故障点。</tr>
