如何在QTextBrowser中实现图像垂直居中并偏移-10？

在Qt 6.8.3的QTextBrowser中，旧HTML属性（如hspace、align="absmiddle"）的支持有限，尤其是负偏移的hspace会被忽略。推荐用CSS样式来实现需求，以下是两种可行方案：

方案1：内联CSS直接设置图像样式 #

用vertical-align: middle实现垂直居中，margin-left: -10px实现左移10像素的偏移，这两个属性在Qt富文本引擎中完全支持：

<img src="你的图像路径.png" width="固定宽度值" height="固定高度值" style="vertical-align: middle; margin-left: -10px;">

方案2：容器包裹确保对齐（适用于图文混排场景） #

如果图像和文本混合显示，用span容器包裹图像，统一设置垂直对齐，避免排版错乱：

<span style="vertical-align: middle;">
  <img src="你的图像路径.png" width="固定宽度值" height="固定高度值" style="margin-left: -10px;">
  这里是伴随的文本内容
</span>

纯图像全屏居中+偏移的额外处理 #

如果QTextBrowser中只显示这张图像，先通过代码设置文本浏览器的全局对齐，再叠加图像的偏移样式：

// 设置QTextBrowser全局垂直水平居中
ui->textBrowser->setAlignment(Qt::AlignCenter);
// 加载带偏移的图像HTML
ui->textBrowser->setHtml(R"(
  <img src="image.png" width="200" height="200" style="margin-left: -10px;">
)");

关键说明 #

Qt 6的富文本引擎对现代CSS属性的支持远优于旧HTML属性，margin的负数值可以正常生效，而hspace这类已被废弃的属性在Qt中存在兼容性问题，因此优先选择CSS方案。

内容的提问来源于stack exchange，提问作者sd z