Qt控件样式QSS

Qt控件样式QSS

• ​​QSS样式如何使用​​

• ​​打开 Qt 助手，在索引输入 style sheet​​
• 
  

• ​​Qt部分控件QSS样式​​

QSS样式如何使用

打开 Qt 助手，在索引输入 style sheet

Qt部分控件QSS样式

* {
  outline: none; /* 去掉有焦点时的虚线 */
}
 
QDialog {
  background: #D6DBE9; /* 对话框背景色 */
}
 
QPushButton {
  border: 1px solid #298DFF; /* QPushButton边框的宽度、样式和颜色 */
  border-radius: 3px; /* 边框圆角 */
  background-color: #F2F2F2; /* 背景颜色 */
  color: #298DFF; /* 文本颜色 */
  font-family: "Microsoft YaHei"; /* 文本字体族 */
  font-size: 10pt; /* 文本字体大小 */
}
 
QPushButton:hover { /* 鼠标悬浮在QPushButton上时的状态 */
  background-color: #298DFF;
  color: #F2F2F2;
}
 
QPushButton:checked { /* QPushButton可选中时的状态 */
  border: 1px solid #FF5242;
  background-color: #F2F2F2;
  color: #FF5242;
}
 
QPushButton:pressed { /* 鼠标按压在QPushButton上时的状态 */
  background-color: #257FE6;
}
 
QPushButton:checked:pressed { /* QPushButton处于可选中且鼠标按压在QPushButton上时的状态 */
  background-color: #F2F2F2;
}
 
QPushButton:disabled { /* QPushButton禁用时的状态 */
  border: 1px solid #CDCDCD;
  background-color: #CDCDCD;
  color: #B4B4B4;
}
 
QPushButton#ImageButton { /* 定义图片按钮，ImageButton为对象名，在QSS中为特定对象定制样式 */
  border-image: url(":/Resource/border_image"); /* 使用border-image可以自适应按钮大小 */
  background-color: transparent; /* 不需要背景时可设为透明 */
}
 
QPushButton#ImageButton:hover {
  border-image: url(":/Resource/border_image_hover");
}
 
QPushButton#ImageButton:pressed {
  border-image: url(":/Resource/border_image");
}
 
QPushButton:menu-indicator { /* QPushButton带有菜单时的菜单指示器 */
  subcontrol-origin：padding; /* 菜单指示器的起始点 */
  subcontrol-position: center right; /* 菜单指示器的位置，处于水平靠右且垂直居中 */
  image: url(:/Resource/down_arrow_normal); /* 菜单指示器的图像 */
}
 
QPushButton:menu-indicator:hover, QPushButton:menu-indicator:open { /* 鼠标悬浮在菜单指示器上和菜单指示器启用时的状态 */
  position: relative;
  top: 2px;
  left: 2px;
  image: url(:/Resource/down_arrow_hover);
}
 
QMenu { /* 简单定义菜单样式 */
  border: 1px solid gray;
  border-radius: 3px;
  background-color: #F2F2F2;
}
 
QMenu::item { /* 菜单项的样式 */
  padding: 0px 0px 0px 40px;
  border: 0px solid transparent;
  background-color: transparent;
  color: #298DFF;
  min-width: 108px; /* 菜单项最小宽度，108+40+1*2=150，使得菜单宽度和QPushButton宽度保持一致 */
  min-height: 30px; /* 菜单项的最小高度 */
}
 
QMenu::item:selected { /* 菜单项处于选中时的状态 */
  background-color: #298DFF;
  color: #F2F2F2;
}

"QWidget{boeder: 1px solid #000; background: rgba(255,255,255,130);border-radius: 5px;}"

"                                                                           \
QListWidget { outline: none; border:1px solid #00000000; color: black; }    \
QListWidget::Item { width: 50px; height: 50px; }                            \
QListWidget::Item:hover { background: #4395ff; color: white; }              \
QListWidget::item:selected { background: #4395ff; color: black; }           \
QListWidget::item:selected:!active { background: #00000000; color: black; } \
"

"QFrame{background: #FFFFFF; border-image:none; border-radius: 8px;}"

"QFrame{background-color: rgba(255,255, 255, 204); border-image:none; border-radius: 8px; color: #0050A7; }"

"QLabel{border-image:none; background: transparent; border:none; color:#333333; font-family: \"等线\"; font-size: 24px;}"

"QLabel{border-image:none; background: transparent; border:none; color:#333333; font-family: \"等线\"; font-size: 30px;}"

"QLabel{border-image:none;border:none; background:#FFFFFF; font-family: \"等线\"; font-size: 28px;border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;}"

"   \
QToolButton{border-image: none; color: #004EA1; border: 1px solid #E5E5E5;   \
border-right:none; border-bottom:none; border-left:none; color:#0050A7; font-family: \"等线\"; \
font-size: 24px;border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}  \
"

"QToolButton:hover{border-image: none;color : rgba(0, 78, 161, 100);}"

"QToolButton{border-image: url(:/res/image/close.png); background: transparent;border:none;}"

"QToolButton:hover{border-image: url(:/res/image/close.png);background : rgba(185, 236, 249, 100);border:none;}"

"QToolButton{border-image: none; color: #004EA1; border: 1px solid #E5E5E5; "
"border-bottom:none; border-left:none;color: #666666; font-family: \"等线\"; font-size: 24px;"
"border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}"

"QToolButton:hover{border-image: none;color : rgba(0, 78, 161, 100);}"

"QToolButton{ width: 100px; height:40px;border-image: none;color: #666666; font-family: \"等线\"; font-size: 24px; border-radius: 4px;background: #FFFFFF;}"

"QToolButton{border-image: none; color: #666666; border: 1px solid #E5E5E5; background: rgba(255,255,255,255);font-family: \"等线\"; font-size: 22px;"
"border-bottom:none; border-left:none;"
"border-bottom-left-radius: 8px; border-bottom-right-radius: 0px;border-top-left-radius: 0px; border-top-right-radius: 0px;}"

"QToolButton:!enabled{border-image: none; color: rgba(102, 102, 102, 102); border: 1px solid #E5E5E5; background: rgba(255,255,255,255);font-family: \"等线\"; font-size: 22px;"
"border-bottom:none; border-left:none;"
"border-bottom-left-radius: 8px; border-bottom-right-radius: 0px;border-top-left-radius: 0px; border-top-right-radius: 0px;}"

"QToolButton{border-image: none; color: #666666; border: 1px solid #E5E5E5; background: rgba(255,255,255,255);font-family: \"等线\"; font-size: 22px;"
"border-bottom:none; border-left:none;"
"border-bottom-left-radius: 0px; border-bottom-right-radius: 8px;border-top-left-radius: 0px; border-top-right-radius: 0px;}"

"QToolButton:!enabled{border-image: none; color: rgba(102, 102, 102, 102); border: 1px solid #E5E5E5; background: rgba(255,255,255,255);font-family: \"等线\"; font-size: 22px;"
"border-bottom:none; border-left:none;"
"border-bottom-left-radius: 0px; border-bottom-right-radius: 8px;border-top-left-radius: 0px; border-top-right-radius: 0px;}"

"QComboBox{border: 1px solid gray;border-radius:6px; padding: 1px 40px 1px 1px; color: #333333; background: transparent;font-family: \"等线\"; font-size: 20px;}"

"QComboBox::drop-down{margin-right: 10px; background-color: transparent; }"

"QComboBox::down-arrow {width:25px; height:25px; border: 1px solid gray;border-radius:6px; background: transparent; border-image: url(:/res/image/down.png);}"

"QComboBox::down-arrow:on{width:25px; height:25px; border-image: url(:/res/image/up.png);}"

"QComboBox QAbstractItemView{border-image: none;color: #333333;background-color: rgb(255, 255, 255);border-radius:0px;outline:none; font-family: \"等线\"; font-size: 20px;}"

"QComboBox QAbstractItemView::item{color: #333333;border: 1px solid gray;border-radius:6px;font-family: \"等线\"; font-size: 20px;}"

"QComboBox QAbstractItemView::item:hover{color: green;border: 1px solid green;border-radius:6px;font-family: \"等线\"; font-size: 20px;}"

"QProgressBar{border-image:none;border:none;}"

"QProgressBar{"
//                "border:2px solid grey;border-radius:11px;text-align:center;"
//                "height:30;"
                "background: red;"
//                "text-align: center;"
//                "color:rgb(0,0,0);"
"height:6px;text-align:center;font-size:14px;color:transparent;border-radius:3px;background: #EEEEEE;"
"}"

"QProgressBar::chunk{"
//                "border-top-left-radius:5px;"
//                "border:1px solid black;"
//                "background-color:#CD96CD;"
//                "width:20px;"
"border-radius:3px;"
"background:qlineargradient(spread:pad,x1:0,y1:0,x2:1,y2:0,stop:0 #0088D3,stop:1  #0050A7);"

"}"