QSS-qt样式表

import sys
from PyQt5.QtWidgets import QApplication, QWidget,QLabel,QPushButtonclass BTN(QPushButton):
passclass Demo(QWidget): def __init__(self):
super(Demo, self).__init__()
self.resize(300,400)
self.setWindowTitle('QSS学习')
label=QLabel('测试文本',self)
label.move(50,50)
label.resize(100,100) self.setStyleSheet('QLabel{border-style:solid;border-width:16;border-color: red yellow blue green;}') #设置样式
#样式是个键值对，用；隔开
# background-color 设置背景色
# color 前景色
# font-size:20px 字体大小
# font-family:黑体
# border:3px solid red 边框---上下左右可以分开设置
# border---四条边相同样式
#border-style 四条线统一设置--上 右 下 左
#四条边分开设置 border-top-style border-right-style border-bottom-style border-left-style
# 3px 边框像素---宽度-单位：像素，也可以em,1em=16px
#border-width 上 右 下 左 ----- 边框宽度
#分开设置：border-top-width border-right-width border-bottom-width border-left-width
# solid 实线----边框样式 dotted 点状边框 none无边框 dashed 虚线
# double 双线 groove 定义3D凹槽边框。其效果取决于border-color的值
# ridge 定义3D垄状边框。其效果取决于 border-color的值
# inset 定义3D inset边框。其效果取决于 border-color的值
# outset 定义3D outset边框。其效果取决于 border-color的值
# red 红色
#统一设置 border-color 上 右 下 左
#四条线分开设置 border-top-color border-right-color border-bottom-color border-left-color
#颜色 可以用rgb(2,2,2) 也可以 #00FF00
#常用颜色 https://blog.csdn.net/zy_heu/article/details/78952173
# width: 40px 设置宽度
# height: 40px 设置高度
# image:url(./大象.png) 添加图片
# margin 外边距
# padding 内边距
# content 内容矩形
# 设置多个属性用;隔开if __name__ == '__main__':
app = QApplication(sys.argv)
demo = Demo()
demo.show()
sys.exit(app.exec_())

import sys
from PyQt5.QtWidgets import QApplication, QWidget,QVBoxLayout,QLabel,QPushButton,QCheckBoxclass BTN(QPushButton):
passclass Demo(QWidget): def __init__(self):
super(Demo, self).__init__()
self.resize(300,400)
self.setWindowTitle('QSS学习')
self.setup_ui() def setup_ui(self):
box1=QWidget(self)
box1.setObjectName('box1')
box3=QWidget(box1)
box3.setStyleSheet('.QWidget{background-color:yellow}')
box2 = QWidget(self) #box1.setStyleSheet('color: red') #设置样式
#注意：包括控件本身和所有子控件
#color 前景色 bl = QVBoxLayout()
self.setLayout(bl) bl.addWidget(box1)
bl.addWidget(box2)
label1 = QLabel('标签1', box1)
label1.setObjectName('lm') # 设置ObjectName
label1.setProperty('notice_level','error') #给控件设置自定义属性和属性值
label1.move(50, 50)
btn1 = QPushButton('按钮1', box1)
btn1.move(150, 50)
btn=BTN('按钮',box1)
btn.move(150,100)
label11 = QLabel('标签11', box3) label2 = QLabel('标签2', box2)
label2.move(50, 50)
btn2 = QPushButton('按钮2', box2)
btn2.move(150, 50)
btn2.setObjectName('lm')
label2.setProperty('notice_level', 'warning') # 给控件设置自定义属性和属性值 #选择器：---指明样式对什么控件使用 #通配符选择器--匹配所有控件
#box1.setStyleSheet('* {background-color: yellow;}')
#* 表示所有控件 #类型选择器---通过控件类型来匹配控件
#self.setStyleSheet('.QPushButton{background-color: yellow}')
#QPushButton 表示匹配QPushButton类控件及其子类控件
#.QPushButton 表示匹配QPushButton类控件---不包括子类控件 #ID选择器:----通过ObjectName属性进行选择--使用#
#self.setStyleSheet('#lm{background-color: yellow}')
#ObjectName属性为lm的控件 #self.setStyleSheet('QPushButton#lm{background-color: yellow}')
#在QPushButton类控件当中ObjectName属性为lm的控件 #属性选择器：--根据setProperty自定义属性和属性值进行选择--使用[]
#self.setStyleSheet('.QLabel[notice_level]{background-color: blue}.QLabel[notice_level="error"]{border:3px solid red} .QLabel[notice_level="warning"]{border:3px solid yellow}')
#[notice_level] 具有notice_level属性
#[notice_level="error"] notice_level属性值是error的 #包含选择器：---用空格
#self.setStyleSheet('QWidget#box1 QLabel {background-color: blue}')
#QWidget#box1中包含的QLabel类控件及其所有子控件--直接包含 间接包含都行 #直接包含选择器---- 用 >
#self.setStyleSheet('QWidget#box1 >QLabel {background-color: blue}')
# QWidget#box1中包含的QLabel类控件及其子控件--只能直接包含不包括间接包含 #子控件选择器：---复合控件中的控件--用::
cb1=QCheckBox('物理',box2)
cb1.move(50,100)
#self.setStyleSheet('QCheckBox::indicator {image:url(./大象.png);width:40px;height:40px;}')
#::indicator 表示复选框中的指示器--勾选框
#QCheckBox QRadioButton 都有indicator控件
#QComboBox 有drop-down控件
#QSpinBox,QDateEdit,QDateTimeEdit,QTimeEdit 有up-button down-button up-arrow down-arrow控件
#其它看 https://www.cnblogs.com/liming19680104/p/11146956.html #self.setStyleSheet('#lm,#box1{background-color: blue}')
# 上面选择器分类可以组合使用, 使用逗号隔开即可 #伪状态：---在什么状态下使用样式表---使用:
#self.setStyleSheet('QPushButton#lm:hover{background-color: yellow} QPushButton#lm:pressed{background-color: blue}')
#:hover 鼠标悬停在上面时
#:pressed 控件被按下时
#:checked 控件被选中
#:unchecked 控件未被选中
#:indeterminate checkBox或者radioButton被部分选中(半选中)
#:focus 控件获取焦点
#:disabled 控件失效
#:enabled 控件有效
#:on 控件处于on状态---选择按钮开
#:off 控件处于off状态
#这部分不写时就是普通状态时
#注意：不同的控件可能有某种特定的伪状态, 无法通用, 具体查看官方文档
#! 可以否定 :!checked 没有被选中时
#可以多个连用 :hover:checked 鼠标在上且被选中时 #例子
#self.setStyleSheet('QCheckBox::indicator{width:40;height:40} QCheckBox::indicator:checked{image:url(./对勾.png)} QCheckBox::indicator:unchecked{image:url(./圆圈.png)}')if __name__ == '__main__':
app = QApplication(sys.argv)
demo = Demo()
demo.show()
sys.exit(app.exec_())