PySide-QtWebKit：CSS 字体系列没有效果

Posted 2023-03-07

【中文标题】PySide-QtWebKit：CSS 字体系列没有效果

【英文标题】：PySide-QtWebKit: CSS font-family has no effect

【发布时间】：2013-08-18 05:47:51

【问题描述】：

在 QWebView 中，我使用 QWebView.sethtml() 动态创建和加载 HTML。在我传递给此方法的 HTML 字符串中，我有一个 <style> 部分，我在其中从外部文件注入了一个 CSS 字符串。除了字体系列外，CSS 运行良好。字体总是回退到 QWebView 默认的无衬线字体。我可以使用QWebView.settings().setFontFamily(QtWebKit.QWebSettings.StandardFont, "serif") 更改默认字体，但这只会使页面上的所有内容成为衬线字体，而不是尊重 CSS 字体系列值。

我的 CSS 文件中的相关部分：

.page-title 
    color:#BBBBBB;
    font-family:"Times New Roman",Garamond,serif;

这不会像预期的那样以衬线字体呈现，而是以通用的无衬线字体呈现。但是，颜色显示没有问题。

为了调试，我在调用 QWebView.setHtml() 之前打印了完整的 HTML 字符串，并将输出重定向到一个文件。当我在 Chromium 中打开该文件时，它按预期呈现，让我相信问题不是 HTML/CSS 问题。 Here 是您感兴趣的输出。

编辑：由于我在这里设置赏金，这里有一个简短的 tl;dr 应该总结所有重要的事情：

使用 PySide，如何在通过 QWebView.setHtml() 加载的 HTML 页面中使 QWebView 尊重 CSS 字体系列设置？ 具体来说，是否有一些秘密的隐藏设置可以切换那种行为断断续续？还是我应该将此报告为框架中的错误？

如果您想自己测试一下，Here 是我正在处理的项目的 GitHub 存储库的链接。 README 中列出了依赖项。

【问题讨论】：

读取计算的 CSS 属性（在开发者工具中），看看是否有规则覆盖你的动态 CSS。

除了我已经使用的方法调用之外，我似乎无法在 API 中找到任何相关的内容。但是，在页面中使用 javascript，我发现该部分的计算样式实际上是 Times！所以它被正确计算了，但是 Qt 中的某些东西覆盖了它。

我对您使用的技术知之甚少。但是，目前我能想到的最后一件事是在您的 CSS 规则中使用 !important。像这样：font-family: "Times New Roman", "Garamond", "serif" !important;。祝你好运！

谢谢，但运气不好。

作为测试，我建议在元素的样式属性中包含 font-family 声明，看看是否可行。

【参考方案1】：

在Page.html（您链接的那个）的标题中https://raw.github.com/crayZsaaron/df-legends-reader/master/page.html

我找到了这个..

.page-title 
    color:#BBBBBB;
    font-family:Helvetica, sans-serif;

也许尝试删除这个，或者用这个替换它

.page-title 
    color:#BBBBBB;
    font-family:"Times New Roman",Garamond,serif;

【讨论】：

谢谢，是的，在问这个问题之前和之后，我已经切换了一堆 CSS。我在问题中给出的样式可能不一定与当前项目中的样式相匹配。现在，我认为标题应该在 Helvetica 中，但页面内容应该在 Times New Roman 中，并且 HTML 是在页面加载时计算的，但随后被 Qt 以某种方式覆盖。很抱歉造成混乱。

我需要在运行时查看错误以检查元素并查看影响它的 CSS，你可以做到。右击 chrome，“检查元素”。

在 Chrome 中，该 HTML 文件正确显示，因此没有“问题元素”需要检查。问题不在于 HTML/CSS，而在于 Qt。