如何用CSS修改GtkPopoverMenu(GMenuModel)的背景与文字颜色？

问题原因 #

你的代码中文字颜色生效但背景不显示，核心问题有两个：

• CSS选择器匹配错误：GTK4中菜单栏弹出的popover对应的CSS类是popover-menu，而非你使用的menu。
• 主题样式覆盖：GTK默认主题会给popover设置background-image（如渐变背景），这会覆盖你设置的background属性，导致背景颜色无法显示。

修改方案 #

调整你的CSS代码部分，替换为以下内容：

label#lb { background-color: blue; }
popover *{ color: red; }
popover.popover-menu {
  background-color: rgba(0, 128, 128, 0.8);
  background-image: none;
}

关键修改点说明 #

1. 修正选择器：使用popover.popover-menu精准匹配菜单栏弹出的popover部件，确保样式作用到目标元素。
2. 清除主题背景：添加background-image: none，覆盖主题默认的渐变/图片背景，让自定义的background-color生效。
3. 优化颜色可见性：将原有的淡青色rgba(0,1,1,0.4)调整为更易观察的深青色rgba(0,128,128,0.8)，同时提高透明度值，避免因颜色过淡导致看起来未生效。

完整修改后的代码片段 #

替换原代码中gtk_css_provider_load_from_string的参数部分即可：

gtk_css_provider_load_from_string (provider, 
                        "label#lb {background-color: blue; }"
                        "popover *{ color: red; }"
                        "popover.popover-menu {"
                        "  background-color: rgba(0, 128, 128, 0.8);"
                        "  background-image: none;"
                        "}\n" );

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