PyQt5 - QSS

---

---

#这里MainWindow为实例化出的窗体名（实例名）


qss_style = '''
                    #pushButton_1,#pushButton_2,#pushButton_3,#pushButton_4,#pushButton_5,#pushButton_6{
                        background-color:grey;
                        border-radius:20px;
                        #border:2px solid yellow;
                    }
                    .QPushButton:hover{
                        background-color:blue;
                    }
                    #MainWindow{
                        border-image:url(../Joint_Drive/splash.png);
                    }
                    #tableWidget{
                        background-color:cyan;
                    }
     '''
    MainWindow.setStyleSheet(qss_style)

---

---

QSS常用选择器（QSS Selector）：

1.   通配选择器：*
2.   类型选择器：QPushButton 匹配该类和其子类的实例（前方加上一个.不包含子类的实例）
3.   ID选择器（ObjectName选择器）：#pushButton_1 匹配ObjectName为pushButton_1的控件
*4.  混合使用（使用同一套QSS）：#aaa,#bbb,#ccc 使用逗号隔开即可

QSS伪状态（冒号+操作+{}只能放在选择器最后）：

#pushButton_1:hover{background-color:red}

QSS全局背景、标签、按钮背景设置：

#Window_Object_Name{border-image:url(...)}
当然也可以使用background-image，但是border-image是填充效果，background只是按照像素截取执行区域显示！！
#pushButton_1{
                 background-image:url(...);
}

QSS控件圆角：

#pushButton_1{
                 border-radius:30px;
}

QSS控件边框：

#pushButton_1{
                 border:2px solid yellow;
}

---

---

外部调用QSS：

with open("./QSS/demo_0628.qss") as f:
    MainWindow.setStyleSheet(f.read())

---

---

 

 

【CSS常用选择器介绍】

• 标签选择器：Tag{xxx:xxx;}
• ID选择器：#ID{xxx:xxx;yyy:yyy;}
• 子元素选择器：#AAA#bbb{xxx:xxx;}
• class选择器：.class{xxx:xxx;}