shape-margin对html表格无效，因其仅作用于设置了float且启用shape-outside的元素，而的display值为table，不被规范支持shape-outside，浏览器直接忽略该声明；替代方案是用margin控制表格整体间距，或将其包裹在支持shape-outside的中并在此容器上设置shape-margin。
shape-margin 对 HTML 表格无效。
它只对设置了 float 且启用了 shape-outside 的元素生效，而表格（<table>）本身不支持 <code>shape-outside —— 浏览器会直接忽略该声明，因此 shape-margin 也就无从作用。
为什么 table 不能用 shape-margin
根本原因在于：shape-outside 要求元素同时满足两个条件：
- 必须是浮动元素（float: left 或 float: right）
- 其 display 值必须能参与文本环绕（如 block、inline-block 等），但原生 <table> 的 <code>display 计算值是 table，这个值被规范排除在 shape-outside 支持范围之外
- 即使强行加 float: left 和 shape-outside: circle()，DevTools 里 shape-outside 也会显示为 “invalid” 或灰色不可用状态
想让文字绕着表格留出额外空隙，该怎么做
实际可用的替代方案只有两类：
- 用
margin控制表格整体与周围文字的距离（最常用、最可靠） 例如：<table style="float: left; margin-right: 20px"><li>把表格包进一个 <code><div>，对该 <code><div> 设置 <code>float+shape-outside+shape-margin注意：此时shape-margin作用的是<div> 的形状轮廓，不是表格本身；表格只是 div 里的子内容<p>示例：</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5117" title="HTML Extract"><img src="https://img.php.cn/upload/skill/000/000/081/179033952939354.jpg" alt="HTML Extract" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill5117" title="HTML Extract" class="overflowclass">HTML Extract</a> <p class="overflowclass">使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...</p> </div> <a rel="nofollow" href="/xiazai/skill5117" title="HTML Extract" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <pre class="brush:php;toolbar:false;"><div style="float: left; shape-outside: circle(50px); shape-margin: 15px; width: 100px; height: 100px;"> <table><tr><td>A</td></tr></table> </div></pre> <p>这里 <code>shape-margin: 15px是给圆形轮廓外扩 15px 空隙，文字会绕着这个放大后的圆走 —— 但表格本身仍按默认盒模型渲染，不参与形状计算。容易踩的坑
常见误操作包括：
- 直接给
<table> 写 <code>shape-outside或shape-margin→ 浏览器静默忽略，毫无效果 - 以为
border-spacing或cellpadding能影响文字环绕 → 它们只管单元格内部或之间，和外部文字流无关 - 用
padding给表格“撑开”文字间距 → padding 是内容区内部留白，不影响浮动环绕逻辑
真正影响文字环绕距离的，只有浮动容器的
margin和（如果用了shape-outside）其配套的shape-margin—— 但表格自己永远不是那个“容器”。 - 直接给
