Delphi 网络浏览器和 CSS3
我的应用程序将一些 HTML 加载到 Web 浏览器中(来自 bsalsa.com 的 TEmbeddedWB),我想使用一些 CSS3 功能,例如 <代码>边框半径。我安装了 Internet Explorer 9,因为它支持 border-radius
属性。好的,为了测试该属性在 Delphi 应用程序中是否有效,我创建了一个带有 Memo 和 TEmbeddedWB 的新项目。在 Memo1OnChange
事件中,我让 Web 浏览器加载备忘录中的任何文本。然后,我在备忘录中输入以下文本:
<div style="background-color:green; border-style: solid; border-width: 2px;
border-radius: 10px 10px 10px 10px; width:200px; height:200px;"></div>
网络浏览器显示绿色框,但没有边框半径!然后我尝试将其保存到文件中,并在 IE9 中加载它,边框半径清晰可见。
我还将注册表项 FEATURE_BROWSER_EMULATION
设置为我的 Project1.exe,值为 9999,对于 64 位内容,Wow6432Node
中的注册表项设置为相同值。
我还针对 www.WhatsMyUserAgent.com 检查了 Useragent,它说我正在运行 MSIE9.0
任何其他我需要做什么?
编辑 - 已修复: - 显然我的文档中需要以下元标记:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
My app loads some HTML into a Webbrowser (TEmbeddedWB from bsalsa.com), and I would like to use some CSS3 features like border-radius
. I installed Internet Explorer 9, because it supports the border-radius
property. Okay, so just to test if the property works in a Delphi application, I make a new project with a Memo and a TEmbeddedWB. In the Memo1OnChange
event I make the Webbrowser load whatever text is in the memo. I then type the following text into the memo:
<div style="background-color:green; border-style: solid; border-width: 2px;
border-radius: 10px 10px 10px 10px; width:200px; height:200px;"></div>
And the webbrowser displays the green box, but there are no border-radii! I then try to save it to a file, and load it up in IE9, and the border-radii are clearly visible.
I have also set the Registry Key FEATURE_BROWSER_EMULATION
to my Project1.exe, with a value of 9999, and the same for the key in the Wow6432Node
, for the 64-bit stuff.
I have also checked the Useragent against www.WhatsMyUserAgent.com, and it says I am running MSIE9.0
Anything else I need to do?
EDIT - FIXED: - Apparently I need the following Metatag in my document:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
问题是我的 HTML 代码(参见 OP)不包含以下内容:
通过这样做,您可以避免修改注册表,因为上面的内容强制 Web 浏览器以 IE9 标准模式呈现。 TWebbrowser 组件默认设置为 IE7。
我通过在修改和不修改注册表的情况下执行上述操作来测试这一点,并且自从我安装了 IE9 以来它就有效了。
当然,只有您自己创建文档,或者找到一些偷偷摸摸的方法将其注入到文档中,您才能确保上述代码存在。如果您希望 CSS3 内容在第 3 方网站上运行,那么您需要注册表项(当然,除非他们的文档中包含上述代码)。
这是注册表项:
HKEY_CURRENT_USER/Software/Microsoft/Internet Explorer/Main/FeatureControl/FEATURE_BROWSER_EMULATION
。添加一个 DWORD 密钥,并将其命名为 YOURAPPNAME.exe(在我的例子中为 Project1.exe)。将值设置为以下值之一:(来自 MSDN)
由于我想强制使用 IE9 标准,我的注册表窗口将如下所示:
通过这样做,您可以告诉应用程序内的 Web 浏览器您想要使用 IE9 标准(CSS3 和 HTML5 内容)。 现在,我的OP中的代码仍然无法工作,即使我们刚刚这样做了。为什么?因为我缺少一个
doctype
。通过添加文档类型,边框半径属性起作用了。希望这对其他面临同样问题的人有所帮助。
The problem was that my HTML code (see OP) did not include the following:
By doing this, you can avoid having to modify the Registry, as the above forces the Webbrowser to render in IE9 Standards mode. The TWebbrowser component by default is set to IE7.
I tested this by doing the above with and without the registry modification, and it worked since I have IE9 installed.
Of course, you can only ensure that the above code is present if you create the document yourself, or find some sneaky way of injecting it into the document. If you want CSS3 stuff working on 3rd party websites, then you need the registry key (unless of course they have the above code in their document).
This is the registry key:
HKEY_CURRENT_USER/Software/Microsoft/Internet Explorer/Main/FeatureControl/FEATURE_BROWSER_EMULATION
. Add a DWORD key, and name it YOURAPPNAME.exe (in my case, Project1.exe). Set the value to one of the following:(From MSDN)
Since I want to force IE9 Standards, my Regedit window will look like this:
By doing that, you are telling the Webbrowser inside your app that you want to use IE9 Standards (CSS3 and HTML5 stuff). Now, the code in my OP will still not work, even though we just did this. Why? Because I was missing a
doctype
. By adding a doctype, the border radius property worked.Hope this is helpful to whoever else faces the same issue.