Windows Forms C# WebBrowser控件在系统字体缩放125%/150%时不显示自定义HTML

这个问题本质上是Windows Forms应用的高DPI兼容性与WebBrowser控件依赖的IE渲染引擎交互冲突导致的：

• Windows Forms默认采用「系统DPI感知」模式，当系统字体缩放（即DPI缩放）超过100%时，控件的实际尺寸计算会出现偏差，WebBrowser控件的渲染上下文无法正常初始化，最终导致HTML内容无法渲染。
• WebBrowser控件默认使用IE兼容模式渲染，这种模式对高DPI缩放的支持极差，尤其是在未明确指定文档模式和viewport设置时，很容易出现空白或布局错乱的情况。

下面是几个经过验证的解决步骤，建议按优先级尝试：

1. 为应用程序启用高DPI感知 #

这是解决高DPI问题的基础，让Windows系统识别你的应用支持高DPI缩放，避免系统强制拉伸控件引发异常。

方法A：通过app.config配置（.NET Framework 4.7+适用） #

在应用的app.config文件中添加以下配置：

<configuration>
  <appSettings>
    <add key="EnableWindowsFormsHighDpiAutoResizing" value="true" />
  </appSettings>
  <System.Windows.Forms.ApplicationConfigurationSection>
    <add key="DpiAwareness" value="PerMonitorV2" />
  </System.Windows.Forms.ApplicationConfigurationSection>
</configuration>

方法B：通过应用程序清单声明（低版本.NET适用） #

如果你的应用使用较低版本的.NET Framework，可以在Manifest文件中添加DPI感知声明：

<assembly xmlns="urn:schemas-microsoft-com:asm.v1" manifestVersion="1.0">
  <application xmlns="urn:schemas-microsoft-com:asm.v3">
    <windowsSettings>
      <dpiAware xmlns="http://schemas.microsoft.com/SMI/2005/WindowsSettings">true/PM</dpiAware>
    </windowsSettings>
  </application>
</assembly>

2. 优化HTML内容的渲染设置 #

给你的HTML内容添加必要的元标签，强制IE使用最新渲染模式并正确处理高DPI缩放：
修改设置DocumentText的代码，补充head部分：

WebBrowser1.DocumentText = @"<html>
<head>
    <meta http-equiv='X-UA-Compatible' content='IE=edge' />
    <meta name='viewport' content='width=device-width, initial-scale=1.0' />
</head>
<body>
Please enter your name:<br/>
<input type='text' name='userName'/><br/>
<a href='http://www.microsoft.com'>continue</a>
</body></html>";

• <meta http-equiv='X-UA-Compatible' content='IE=edge' />：强制WebBrowser控件使用IE最新可用的渲染引擎，规避兼容模式的bug。
• <meta name='viewport'...>：告诉渲染引擎正确适配设备DPI，避免内容缩放异常。

3. 调整WebBrowser控件的初始化时机 #

如果控件还未完全初始化就设置DocumentText，可能会导致渲染失败。可以尝试在控件的HandleCreated事件触发后再加载HTML内容：

private void WebBrowser1_HandleCreated(object sender, EventArgs e)
{
    WebBrowser1.DocumentText = @"<html>
<head>
    <meta http-equiv='X-UA-Compatible' content='IE=edge' />
    <meta name='viewport' content='width=device-width, initial-scale=1.0' />
</head>
<body>
Please enter your name:<br/>
<input type='text' name='userName'/><br/>
<a href='http://www.microsoft.com'>continue</a>
</body></html>";
}

记得在设计器中给WebBrowser控件绑定HandleCreated事件。

4. 替代方案：使用NavigateToString方法 #

部分场景下DocumentText在高DPI环境下存在兼容性问题，可以尝试用NavigateToString方法替代：

WebBrowser1.NavigateToString(@"<html>
<head>
    <meta http-equiv='X-UA-Compatible' content='IE=edge' />
    <meta name='viewport' content='width=device-width, initial-scale=1.0' />
</head>
<body>
Please enter your name:<br/>
<input type='text' name='userName'/><br/>
<a href='http://www.microsoft.com'>continue</a>
</body></html>");

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