qtdesigner界面美化

最新推荐文章于 2026-03-29 10:58:01 发布

原创

最新推荐文章于 2026-03-29 10:58:01 发布 · 6.8k 阅读

标签

#qt5 #python

本文介绍了如何使用QSS美化PyQt5界面，包括选择器介绍及应用实例，并讲解了如何利用自定义属性批量设置控件样式。

文章目录

前言
一、QSS
- 1.1、QSS选择器介绍
- 2.2、使用
二、自定义属性
- 2.1、添加自定义属性

前言

pyqt5能快速构建界面，但是你会发现构建出来的界面没有像我们平常用的客户端界面一样美观。现在，就让我学习一下如何美化界面。本章代码使用qtdesigner页面布局中的代码继续学习

一、QSS

QSS和CSS类似，只不过QSS适用于qt界面设计，语法上跟CSS差不多，就是选择器上有所不同

1.1、QSS选择器介绍

下面列出常用QSS选择器及其用法

Selector	示例	说明
Universal Selector	*	星号匹配所有的界面元素
Type Selector	QPushButton	选择所有 QPushButton类型（包括其子类）
Class Selector	.QPushButton	选择所有 QPushButton类型，但是不包括其子类
ID Selector	QPushButton#okButton	选择所有对象名为 okButton 的QPushButton类型
Property Selector	QPushButton[flat=“false”]	选择所有 flat 属性值为 false 的 QPushButton类型。
Descendant Selector	QDialog QPushButton	选择所有 QDialog 内部 QPushButton类型
Child Selector	QDialog > QPushButton	选择所有 QDialog 直接子节点 QPushButton类型

2.2、使用

例如做下面一个这样的界面
在这里插入图片描述
QSS代码是在styleSheet下编写设置，这里我在主窗口(Form类)下的styleSheet。

注意：如果一个元素的显示样式被多层指定了，越靠近元素本身的选择指定，优先级越高。(例如你在主窗体类里面指定了样式，有在控件本身指定了样式，那样式以自身指定的为准)