必须用容器包裹+固定正方形尺寸+overflow:hidden+object-fit:cover，缺一不可；单独给img加border-radius:50%无效，因其仅定义边框弧度而不裁剪内容，真正起裁剪作用的是overflow:hidden且须与border-radius同元素。
必须用容器包裹 + 固定正方形尺寸 + overflow: hidden + object-fit: cover，缺一不可。单独给 <img> 加 border-radius: 50% 几乎必然失败。
为什么 border-radius: 50% 单独写没用？
它只定义“边框弧度”，不裁内容——就像给窗户装圆角玻璃，窗外景物还是方的。真正起裁剪作用的是 overflow: hidden，且必须和 border-radius 写在同一个元素上。长方形图直接套在 <img> 上，宽高不等时 50% 会算出椭圆半径，根本不是圆。
标准实现：用 <div> 包裹并设约束
<p>这是兼容性最稳、行为最可预期的方式：</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/code/12093" title="CSS婚礼策划服务机构宣传网站模板"><img
src="https://img.php.cn/upload/webcode/000/000/018/178607072210981.jpg" alt="CSS婚礼策划服务机构宣传网站模板" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/code/12093" title="CSS婚礼策划服务机构宣传网站模板" class="overflowclass">CSS婚礼策划服务机构宣传网站模板</a>
<p class="overflowclass">CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。</p>
</div>
<a rel="nofollow" href="/xiazai/code/12093" title="CSS婚礼策划服务机构宣传网站模板" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<ul>
<li>
<code>width 和 height 必须完全相等（如 120px），不能一个用 auto
border-radius: 50% 和 overflow: hidden 必须同时加在 <div> 上
<li>
<code><img> 设为 width: 100%; height: 100%，再加 object-fit: cover ——contain 留白，fill 拉伸display: block 给 <img>，否则底部基线间隙会露白边<div style="width: 120px; height: 120px; border-radius: 50%; overflow: hidden;"> @@##@@ </div>
clip-path: circle() 能绕过正方形限制吗？
能，但有代价：
-
clip-path: circle(50% at 50% 50%)确实不要求容器是正方形，它按几何路径裁剪 - 但必须搭配
object-fit: cover，否则图片可能偏移或缩放异常 - IE 完全不支持，iOS Safari 15.4 以下表现不稳定，微信旧版 WebView 常失效
- 若降级方案缺失，用户看到的就是原图矩形+毛边，而不是安全的圆
邮件模板或老环境怎么办？
它们基本不支持 object-fit 和 clip-path：
- 放弃 CSS 裁剪，提前用 Photoshop / Figma 把图切成正方形再上传
- 内联样式必须写死
width/height，不能用rem或百分比 - 避免任何现代属性，
border-radius在 Gmail/Outlook 中虽支持，但仅限于块级元素且需配合overflow: hidden
真正容易被忽略的点是：你以为在调样式，其实是在协调盒模型、渲染层、图片加载时机三者之间的博弈。宽高不等、overflow 缺失、object-fit 漏写——任何一个漏掉，圆就塌了。
