QML RichText组件如何全局应用CSS属性？

1. 在RichText内容中嵌入全局<style>标签 #

直接在每个RichText的HTML内容开头加一个<style>块，定义全局样式规则，匹配的HTML元素会自动套用样式，不用逐个写inline style。

示例：

Text {
    text: "<style>code { background-color: black; text-indent: 10px; color: white; }</style>" +
          "<p>这段文本里的<code>代码块</code>和另一个<code>代码片段</code>都会自动用全局样式</p>"
    textFormat: Text.RichText
}

2. 提取全局CSS为共享常量 #

如果多个Text组件需要相同样式，把CSS定义成全局字符串常量，在各个组件里复用，避免重复代码。

示例：

property string globalCss: "<style>code { background-color: black; text-indent: 10px; } p { margin: 5px 0; }</style>"

Text {
    text: globalCss + "<p>第一个RichText内容，包含<code>代码</code></p>"
    textFormat: Text.RichText
}

Text {
    text: globalCss + "<p>第二个RichText内容，包含<code>另一段代码</code></p>"
    textFormat: Text.RichText
}

注意事项 #

• QML的RichText仅支持CSS 2.1的子集，像background-color、text-indent这类基础属性没问题，但复杂选择器（如子选择器、伪类）大概率不支持，需要自行测试验证。
• 若使用Qt 5.14及以上版本，要求更完整的CSS支持的话，可以考虑用TextEdit（配合TextEdit.RichText）或WebEngineView来渲染，但纯文本展示场景下，Text组件的RichText足够满足需求。

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