使用Qt美化控制元件時qss必不可少，本文記錄各個控制元件如何使用qss進行美化，不定時更新。。。

QSlider

// 一定要先設定groove，不然handle的很多效果將沒有
QSlider::groove:horizontal {
    border: none;
    height: 4px;
    background: red;
}
QSlider::handle:horizontal {
    border: none;
    margin: -5px 0px; // 上下邊距和左右邊距
    width: 14px;
    height: 14px;
 

    border-radius: 7px;
    background: #6495E0;
}
// 劃過部分
QSlider::sub-page:horizontal {
    background: #6495E0;
    height: 4px;
}
// 未劃過部分
QSlider::add-page:horizontal { 
    background: black; 
    height: 4px;
}

效果圖：

QScrollBar

QScrollArea#musicMangeScrollArea {
    border: none;
    background-
 
color: #f5f5f7;
}
QScrollBar:vertical {
    border: none;
    background: #f5f5f7;
    width: 10px;
    margin: 0px 0 0px 0;
}
QScrollBar::handle:vertical {
    background: Gainsboro;
    min-height: 20px;
    border-radius: 5px;
    border: none;
}
QScrollBar::add-line:vertical {
    border: 0px solid grey;
 

    background: #32CC99;
    height: 0px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}
QScrollBar::sub-line:vertical {
    border: 0px solid grey;
    background: #32CC99;
    height: 0px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}
QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
    background: none;
    width: 0px;
    height: 0px;
}

效果圖：