（2019-1-3改進）

把上次的純色背景加了點漸變，感覺好看了點。

關於顏色顯示：有些電腦顯示器設定偏亮/暗，可以調節下。

關於控制元件大小：標題高度30畫素，控制元件高度28px。

關於字型大小：一般設定為15px的宋體，沒有考慮解析度問題。

關於圖示：阿里圖示https://www.iconfont.cn/

本例百度雲連線：https://pan.baidu.com/s/1ALvI7FStr9YIx942QQTv1Q

提取碼：0q96

效果圖：

QSS程式碼：

*{
font:15px "宋體";
color: rgb(230, 230, 230);
selection-background-color: rgb(255, 255, 255);/*選中文字*/
selection-color: rgb(0, 0, 0);
outline:none;/*焦點框*/
}
#centralWidget{
background-color: rgb(80, 80, 80);
border-bottom:5px solid rgb(20, 20, 20);
}
/*其他(控制元件公共樣式在最後)*/

/*tab 1中按鈕示例*/
#btnHoverOrange{
border-color:rgb(255, 170, 0);
}
#btnPressOrange{
color:black;
border-color: rgb(128, 128, 128);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(255, 177, 21, 255), stop:0.528409 rgba(236, 157, 0, 255), stop:1 rgba(255, 170, 0, 255));
}
#btnHoverBlue{
border-color:rgb(0, 170, 255);
}
#btnPressBlue{
color:black;
border-color: rgb(128, 128, 128);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(0, 170, 255, 255), stop:0.511364 rgba(0, 151, 227, 255), stop:1 rgba(0, 170, 255, 255));
}
/*tab 1中勾選框示例*/
#checkHoverOrange{
color: rgb(255, 170, 0);
}
#checkHoverOrange::indicator{
border-image: url(:/img/check_orange.png);
}
#checkCheckOrange::indicator{
border-image: url(:/img/checked_orange.png);
}
#checkHoverBlue{
color: rgb(0, 170, 255);
}
#checkHoverBlue::indicator{
border-image: url(:/img/check_blue.png);
}
#checkCheckBlue::indicator{
border-image: url(:/img/checked_blue.png);
}
#checkHoverGreen{
color: rgb(0, 255, 170);
}
#checkHoverGreen::indicator{
border-image: url(:/img/check_green.png);
}
#checkCheckGreen::indicator{
border-image: url(:/img/checked_green.png);
}
/*tab1 下拉框示例*/
#comboHover{
border:1px solid rgb(255, 170, 0);
}
#comboHover::down-arrow{
border-image: url(:/img/down_orange.png);
}
/*tab 1編輯框示例*/
#editHover{
border:1px solid rgb(255, 170, 0);
}
/*tab 1數字框示例*/
#spinHoverOrange{
border:1px solid rgb(255, 170, 0);
}
#spinHoverOrange::up-button{
border-image: url(:/img/up_orange.png);
}
#spinHoverBlue{
border:1px solid rgb(0, 170, 255);
}
#spinHoverBlue::up-button{
border-image: url(:/img/up_blue.png);
}
/*自定義按鈕欄*/
#toolBar{	
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(57, 57, 57, 255), stop:0.534091 rgba(20, 20, 20, 255), stop:1 rgba(73, 73, 73, 255));
border-bottom:2px solid rgb(0, 170, 255);
}
#toolBar QPushButton{	
color: rgb(200, 200, 200);
border:0;
border-radius:0;
background-color: transparent;
}
#toolBar QPushButton:hover{		
color:rgb(255, 170, 0);
background-color: rgba(255, 255, 255, 50);
}
#toolBar QPushButton:pressed{		
background-color: rgba(255, 255, 255, 80);
}
QPushButton#btnSet{
background-image: url(:/img/set_gray.png);
background-repeat:no-repeat;
background-position:center center;
}
QPushButton#btnSet:hover{
background-image: url(:/img/set_orange.png);
}
QPushButton#btnMin{
background-image: url(:/img/min_gray.png);
background-repeat:no-repeat;
background-position:center center;
}
QPushButton#btnMin:hover{
background-image: url(:/img/min_orange.png);
}
QPushButton#btnMax{
background-image: url(:/img/max_gray.png);
background-repeat:no-repeat;
background-position:center center;
}
QPushButton#btnMax:hover{
background-image: url(:/img/max_orange.png);
}
QPushButton#btnMax:checked{
background-image: url(:/img/normal_gray.png);
}
QPushButton#btnMax:checked:hover{
background-image: url(:/img/normal_orange.png);
}
QPushButton#btnClose{
background-image: url(:/img/close_gray.png);
background-repeat:no-repeat;
background-position:center center;
}
QPushButton#btnClose:hover{
background-image: url(:/img/close_red.png);
}
/*分裂器*/
QSplitter::handle{
background-color: rgb(60, 60, 60);
margin:2px;
}
/*滾動區域*/
QScrollArea{
border:0;
background-color: transparent;
}
QScrollArea>QWidget>QWidget{
background-color: rgb(80, 80, 80);
}
/*滾動條 */
QScrollBar:vertical{/*豎向*/
width:20px;
padding:0 3px;
margin:0;
background-color:transparent;
}
QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical{
background-color: transparent;
}
QScrollBar::handle:vertical{
width:10px;
min-height:20px;
margin:20px 0;
border-radius:5px;
background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(91, 91, 91, 255), stop:0.545455 rgba(107, 107, 107, 255), stop:1 rgba(85, 85, 85, 255));
}
QScrollBar::handle:vertical:hover{
background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(136, 136, 136, 255), stop:0.545455 rgba(157, 157, 157, 255), stop:1 rgba(139, 139, 139, 255));
}
QScrollBar::add-line:vertical{
height:20px;
width:20px;
subcontrol-position:bottom;
border-image: url(:/img/down2_white.png);
}
QScrollBar::sub-line:vertical{
height:20px;
width:20px;
subcontrol-position:top;
border-image: url(:/img/up2_white.png);
}
QScrollBar::sub-line:vertical:hover{
border-image: url(:/img/up2_orange.png);
}
QScrollBar::add-line:vertical:hover{
border-image: url(:/img/down2_orange.png);
}
QScrollBar:horizontal{/*橫向*/
height:20px;
padding:3px;
margin:0;
background-color:transparent;
}
QScrollBar::add-page:horizontal,QScrollBar::sub-page:horizontal{
background-color: transparent;
}
QScrollBar::handle:horizontal{
height:10px;
min-width:20px;
margin:0 20px;
border-radius:5px;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(91, 91, 91, 255), stop:0.545455 rgba(107, 107, 107, 255), stop:1 rgba(85, 85, 85, 255));
}
QScrollBar::handle:horizontal:hover{
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(136, 136, 136, 255), stop:0.545455 rgba(157, 157, 157, 255), stop:1 rgba(139, 139, 139, 255));
}
QScrollBar::add-line:horizontal{
height:20px;
width:20px;
subcontrol-position:right;
border-image: url(:/img/right2_white.png);
}
QScrollBar::sub-line:horizontal{
height:20px;
width:20px;
subcontrol-position:left;
border-image: url(:/img/left2_white.png);
}
QScrollBar::add-line:horizontal:hover{
border-image: url(:/img/right2_orange.png);
}
QScrollBar::sub-line:horizontal:hover{
border-image: url(:/img/left2_orange.png);
}
/*ToolBox*/
QToolBox{
background-color: rgb(80, 80, 80);/*背景色-空隙顏色*/
border:1px solid rgb(128, 128, 128);
border-top-left-radius:16px 24px;
}
QToolBox>QWidget>QWidget>QWidget{/*tab頁*/
background-color: rgb(80, 80, 80);
}
QToolBox>QAbstractButton{/*標題欄*/
min-height:30px;
}
QToolBox::tab{
color: rgb(230, 230, 230);
padding-left:30px;
border-top-left-radius:16px 24px;
border-top:1px solid rgb(128, 128, 128);
border-left:1px solid rgb(128, 128, 128);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(60, 60, 60, 255), stop:0.238636 rgba(40, 40, 40, 255), stop:0.909091 rgba(87, 87, 87, 255));
}
QToolBox::tab:first{
border-top:0;
border-left:0;
}
QToolBox::tab:hover{
color:black;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(255, 177, 21, 255), stop:0.295455 rgba(245, 163, 0, 255), stop:0.909091 rgba(255, 201, 93, 255));
}
QToolBox::tab:selected{
color:rgb(255, 170, 0);
border-bottom:1px solid rgb(0, 170, 255);
}
QToolBox::tab:selected:hover{
color:black;
}
/*TabWidget*/
QTabWidget{
}
QTabWidget>QWidget>QWidget{/*tab頁*/
background-color: rgb(80, 80, 80);
}
QTabWidget::tab-bar{
alignment:left;/*tab位置*/
}
QTabWidget::pane { /*內容區域*/
background-color: rgb(80, 80, 80);/*背景色-空隙顏色*/
border:1px solid rgb(128, 128, 128);
} 
QTabBar{
color:white;
background-color:transparent;
}
QTabBar::tab{/*頁籤*/
min-height:28px;
width:120px;
color: rgb(230, 230, 230);
margin-right:1px;
margin-bottom:1px;
border-top-left-radius:16px 24px;
border:1px solid rgb(128, 128, 128);
border-bottom:0;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(60, 60, 60, 255), stop:0.238636 rgba(40, 40, 40, 255), stop:0.909091 rgba(87, 87, 87, 255));
}
QTabBar::tab:hover{
color:black;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(255, 177, 21, 255), stop:0.295455 rgba(245, 163, 0, 255), stop:0.909091 rgba(255, 201, 93, 255));
}
QTabBar::tab:selected{
color:rgb(255, 170, 0);
border-bottom:1px solid rgb(0, 170, 255);
}
QTabBar::tab:selected:hover{
color:black;
}
QTabBar::tear{/*選項過多時的。。。*/
imag:;
}
QTabBar::scroller{
width:60px;
}
/*文字框*/
QTextEdit{
color:white;
border:1px solid rgb(128, 128, 128);
background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(90, 90, 90, 255), stop:0.789773 rgba(90, 90, 90, 255), stop:1 rgba(102, 102, 102, 255));
}
/*按鈕*/
QPushButton{
color:rgb(240, 240, 240);
border:1px solid rgb(128, 128, 128);
border-radius:3px;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(66, 66, 66, 255), stop:0.517045 rgba(46, 46, 46, 255), stop:1 rgba(69, 69, 69, 255));
}
QPushButton:hover{
border-color:rgb(255, 170, 0);
}
QPushButton:pressed{
border-color: rgb(128, 128, 128);
color:black;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(255, 177, 21, 255), stop:0.528409 rgba(236, 157, 0, 255), stop:1 rgba(255, 170, 0, 255));
}
QPushButton:checked{
color:rgb(0, 255, 170);
border-color: rgba(0, 255, 170, 128);
background-image: url(:/img/right3_green.png);
background-repeat:no-repeat;
background-position:center left;
}
QPushButton:disabled{
color: rgb(230, 230, 230);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(150, 150, 150, 255), stop:0.522727 rgba(134, 134, 134, 255), stop:1 rgba(150, 150, 150, 255));
}
QPushButton:checked:pressed{
color:black;
}
QPushButton:checked:disabled{
color: rgb(230, 230, 230);
border-color: rgb(128, 128, 128);
background-image: url(:/img/right3_white.png);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(150, 150, 150, 255), stop:0.522727 rgba(134, 134, 134, 255), stop:1 rgba(150, 150, 150, 255));
}
/*勾選框*/
QCheckBox{
margin-left:5px;
spacing:3px;/*點選框與文字距離*/
color: rgb(250, 250, 250);
}
QCheckBox:hover{
color: rgb(0, 255, 170);
}
QCheckBox:disabled{
color: rgb(230, 230, 230);
}
QCheckBox::indicator{/*點選框*/
width:20px;
height:20px;
}
QCheckBox::indicator:unchecked{/*可新增未點選時點選區域圖片*/
border-image: url(:/img/check_white.png);
}
QCheckBox::indicator:unchecked:hover{
border-image: url(:/img/check_green.png);
}
QCheckBox::indicator:unchecked:disabled{
border-image: url(:/img/check_white.png);
}
QCheckBox::indicator:checked{/*點選時區域樣式*/
border-image: url(:/img/checked_green.png);
}
QCheckBox::indicator:checked:hover{
border-image: url(:/img/checked_green.png);
}
QCheckBox::indicator:checked:disabled{
border-image: url(:/img/checked_white.png);
}
QCheckBox::indicator:indeterminate{/*半選中狀態*/
}
/*下拉列表*/
QComboBox{
padding-left: 5px;
padding-right: 2px;
color:rgb(250 ,250 ,250);
border:1px solid rgb(128, 128, 128);
background-color:  rgb(100 ,100 ,100);
}
QComboBox:hover{
border:1px solid rgb(255, 170, 0);
}
QComboBox:disabled{
color: rgb(230, 230, 230);
background-color:rgb(150, 150, 150);
}
QComboBox:editable{
background-color:rgb(100, 100, 100);
}
QComboBox:editable:disabled{
background-color:rgb(150, 150, 150);
}
QComboBox QAbstractItemView{
background-color:rgb(110, 110, 110);
}
QComboBox QAbstractItemView::item{/*需要程式碼中->setView(new QListView(this));*/
height:26px;
font: 15px "宋體";
}
QComboBox QAbstractItemView::item:hover{
color:black;
background-color: rgb(255, 170, 0);
}
QComboBox QAbstractItemView::item:selected{
background-color: rgb(255, 170, 0);
}
QComboBox::drop-down {
width:20px;
height:20px;
subcontrol-position: center right;
right:2px;
border:0;
background-color:transparent;
}
QComboBox::down-arrow {/*替換三角小圖示*/
width:20px;
height:20px;
border-image: url(:/img/down_white.png);
}
QComboBox::down-arrow:hover {
border-image: url(:/img/down_orange.png);
}
QComboBox::down-arrow:disabled {
border-image: url(:/img/down2_white.png);
}
/*編輯框*/
QLineEdit{
padding: 0 5px;
color: rgb(250 ,250 ,250);
background-color: rgb(100, 100, 100);
border:1px solid rgb(128, 128, 128);
}
QLineEdit:hover{
border:1px solid rgb(255, 170, 0);
}
QLineEdit[readOnly=true],QLineEdit:disabled{
color: rgb(230, 230, 230);
background-color:rgb(150, 150, 150);
}
/*整數框*/
QSpinBox{
padding:0 5px;
color: rgb(250, 250, 250);
background-color:  rgb(100, 100, 100);
border:1px solid rgb(128, 128, 128);
}
QSpinBox:hover{
border:1px solid rgb(255, 170, 0);
}
QSpinBox:disabled{
color: rgb(230, 230, 230);
background-color:rgb(150, 150, 150);
}
QSpinBox[buttonSymbols="0"]::up-button{/*顯示按鈕=0*/
width:20px;
height:14px;
subcontrol-origin:border;
subcontrol-position:top right;
right:2px;
top:1px;
border-image: url(:/img/up_white.png);
}
QSpinBox[buttonSymbols="0"]::up-button:hover{
border-image: url(:/img/up_orange.png);
}
QSpinBox[buttonSymbols="0"]::up-button:pressed{
}
QSpinBox[buttonSymbols="0"]::up-button:disabled{
border-image: url(:/img/up2_white.png);
}
QSpinBox[buttonSymbols="0"]::down-button{
width:20px;
height:14px;
subcontrol-origin:border;
subcontrol-position:bottom right;
right:2px;
bottom:1px;
border-image: url(:/img/down_white.png);
}
QSpinBox[buttonSymbols="0"]::down-button:hover{
border-image: url(:/img/down_orange.png);
}
QSpinBox[buttonSymbols="0"]::down-button:pressed{
}
QSpinBox[buttonSymbols="0"]::down-button:disabled{
border-image: url(:/img/down2_white.png);
}
/*表頭*/
QHeaderView{
font: 15px "宋體";
color:rgb(230, 230, 230);
background-color: rgb(80, 80, 80);
}
QHeaderView::section:horizontal{/*橫表頭*/
min-height:30px;
border:0;
border-bottom:1px solid rgb(0, 170, 255);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(60, 60, 60, 255), stop:0.301136 rgba(40, 40, 40, 255), stop:0.909091 rgba(68, 68, 68, 255));
}
QHeaderView::section:vertical{/*豎表頭*/
min-width:60px;
padding-left:15px;
border:1px solid rgb(128, 128, 128);
border-top:0;
border-left:0;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(60, 60, 60, 255), stop:0.301136 rgba(40, 40, 40, 255), stop:0.909091 rgba(68, 68, 68, 255));
}
QHeaderView::section{
font: 15px "宋體";
}
QHeaderView::section:hover{
color:black;
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(255, 177, 21, 255), stop:0.335227 rgba(245, 163, 0, 255), stop:0.909091 rgba(255, 192, 66, 255));
}
QHeaderView::section:checked{/*不取消高亮*/
font: 15px "宋體";
color: rgb(255, 170, 0);
}
QHeaderView::section:selected{
font: 15px "宋體";
color: rgb(255, 170, 0);
}
QHeaderView::section:checked:hover{
color: rgb(230, 230, 230);
}
QHeaderView::section:first{/*表頭第一個位置*/
}
QHeaderView::down-arrow{/*圖示用來排序的*/
}
QHeaderView::up-arrow{
}
/*表格*/
QTableView{/*對齊方式程式碼設定*/
border:1px solid rgb(128, 128, 128);
gridline-color: rgb(128, 128, 128);/*網格線顏色*/
background-color: rgb(80, 80, 80);
}
QTableView QTableCornerButton::section{/*表頭左上*/
border:0;
border-bottom:1px solid rgb(0, 170, 255);
background-color: qlineargradient(spread:pad, x1:1, y1:0, x2:1, y2:1, stop:0 rgba(60, 60, 60, 255), stop:0.301136 rgba(40, 40, 40, 255), stop:0.909091 rgba(68, 68, 68, 255));
}
QTableView::item{/*表內容*/
font: 15px "宋體";
color: rgb(230, 230, 230);
background-color: rgb(80, 80, 80);
}
QTableView::item:selected{
color:black;
background-color: rgb(255, 170, 0);
}
QTableView::indicator{
width: 20px;
height: 20px;
}
QTableView::indicator:enabled:checked{
image: ;
}
QTableView::indicator:enabled:unchecked{
image: ;
}
/*滑動條*/
QSlider::groove:vertical {
background: red;
position: absolute;
left: 4px; right: 4px;
}
QSlider::handle:vertical {
height: 10px;
background: green;
margin: 0 -4px; 
}
QSlider::add-page:vertical {
background: white;
}
QSlider::sub-page:vertical {
background: pink;
}
/*選單*/
QPushButton::menu-indicator{/*setmenu*/
image:none;
}
QMenu{
border:1px solid rgb(128, 128, 128);
background-color:rgb(70, 70, 70);
margin:0px;
padding:0px;
}
QMenu::item {
margin:0px;
padding:0 20 0 10px;
font:15px "宋體";
min-height:26px;
max-height:28px;
color:rgb(240, 240, 240);
background-color:rgb(70, 70, 70);
}
QSpacerItem{
background-color: rgb(0, 255, 0);
}
QMenu::item:disabled{
color:rgb(240, 240, 240);
background-color:rgb(110, 110, 110);
}
QMenu::item:selected {
color:black;
background-color: rgb(255, 170, 0);
}
QMenu::item:selected:disabled{
color:rgb(240, 240, 240);
background-color:rgb(110, 110, 110);
}
QMenu::separator {/*分割線*/
height: 1px;
background: transparent;
}
 

完結，Over~~~