QSS选择器使用方法总结
QSS选择器使用方法总结
QSS选择器使用方法总结
# C:\Users\Administrator\AppData\Local\Programs\Python\Python38\Scripts ################################ # PyQt5中文网 - PyQt5全套视频教程 # # https://www.PyQt5.cn/ # # 主讲: 村长 # ################################ from PyQt5.Qt import * import sys class Btn(QPushButton): pass class Window(QWidget): def __init__(self): super().__init__() self.setWindowTitle("QSS选择器使用方法总结 - PyQt5中文网") self.resize(600, 500) self.func_list() def func_list(self): self.func() def func(self): box = QWidget(self) box.setObjectName('box') box1 = QWidget(box) box1.setObjectName('box') box1.resize(100, 60) box1.move(250, 200) box1.setStyleSheet('border:1px solid red') label1 = QLabel('标签1', box) label1.move(100, 200) label1.resize(100, 50) label1.setObjectName('aaa') label2 = QLabel('标签2', box1) label2.move(250, 200) label2.resize(100, 50) label2.setStyleSheet('color:red;') label3 = QLabel('标签3', self) label3.move(400, 200) label3.resize(100, 50) label3.setObjectName('bbb') btn1 = QPushButton('按钮1', box) btn1.move(100, 100) btn1.resize(100, 50) btn1.setProperty('name', 'btn1') btn2 = QPushButton('按钮2', self) btn2.move(250, 100) btn2.resize(100, 50) btn3 = QPushButton('按钮3', self) btn3.setProperty('name', 'btn') btn3.move(100, 300) btn3.resize(100, 50) btn4 = Btn('按钮4', self) btn4.setObjectName('btn') btn4.move(250, 300) btn4.resize(100, 50) print(box1.children()) ck = QCheckBox('选择正确答案', self) ck.move(150, 400) ck.resize(100, 40) sb = QSpinBox(self) sb.move(300, 400) sb.resize(100, 40) # 1.通配符选择器:匹配所有控件 ''' *{ // 用*号匹配所有控件 color:green; } ''' # 2.类型选择器(通过控件类型来匹配控件包含子类) ''' QPushButton{ font-size:30px; } Btn{ font-size:30px; } ''' # 3.类选择器(通过控件类型匹配 不包括子类) ''' .QPushButton{ font-size: 30px; } ''' # 4.ID选择器setObjectName ''' #btn{ background-color:green; } ''' # 5.属性选择器setProperty ''' QPushButton[name="btn"]:hover{ background-color:red; } // 表示只要加上setProperty的所有name属性按钮都是红色背景,不影响其他无样式按钮的新建 QPushButton[name]:hover{ background-color:red; } ''' # 6.后代选择器(通过父控件直接或间接作用于子控件) ''' QWidget#box QPushButton{ background-color:green; } ''' # 7.子选择器(直接包含的子控件) ''' QWidget#box>QLabel{ background-color:green; } ''' # 8.子控件选择器(主要用于组合控件中的一部分组件样式修改) # 8.1.常见伪状态 ''' :checked # 控件被选中 :unchecked # 控件被取消选中 :hover # 鼠标停留 :pressed # 控件被按下 :focus # 获取到焦点 :disable # 失效控件 :enable # 有效控件 :indeterminate # checkBox或radioButton被部分选中 :on # 开启状态 :off # 关闭状态 ''' # 8.2.常用组合控件子控件 ''' QCheckBox, QRadioButton ::indicator QComboBox ::drop-down QSpinBox, QDateEdit, QTimeEdit, QDateTimeEdit ::up-button ::down-button ::up-arrow ::down-arrow QSlider ::groove ::handle ::add-page ::sub-page QProgressBar ::chunk QScrollBar ::sub-line, ::add-line ::sub-page, ::add-page ::up-arrow, ::down-arrow ::left-arrow, ::right-arrow QGroupBox ::title ::indicator QTableView ::item QHeaderView, QTableCornerButton ::section QTreeView ::item ::branch QHeaderView ::section QTabWidget QTabWidget::pane QTabWidget::tab-bar QTabBar::tab QTabBar::close-button QTabBar::tear QTabBar::scroller QTabBar QToolButton::left-arrow QTabBar QToolButton::right-arrow ''' ''' QCheckBox::indicator{ width: 20px; height: 20px; } QCheckBox::indicator:checked{ image: url(y.png); } QCheckBox::indicator:unchecked{ image: url(n.png); } ''' # 9.选择器的组合使用(使用逗号隔开) ''' #aaa,#bbb{ color: red; } ''' pass if __name__ == '__main__': app = QApplication(sys.argv) window = Window() with open('test.qss', 'r', encoding='UTF-8') as f: qApp.setStyleSheet(f.read()) window.show() sys.exit(app.exec_())