1. 程式人生 > >QScrollBar(滾動條)的一個完整樣式記錄

QScrollBar(滾動條)的一個完整樣式記錄

QScrollBar:vertical//首先是設定主體
{
    margin:30px 0px 30px 0px;
    background-color:#F0F1EF;
    border: 0px;
    width:30px;    
}
QScrollBar::handle:vertical//滑塊
{
    background-color:#bbbbbb;
    width:30px;
    border-radius:7px;//圓角
}
QScrollBar::handle:vertical:hover
{
    background-color:#9B9B9B;
    width
:30px; border-radius:7px; } QScrollBar::add-line:vertical//為滾動條下面的箭頭區域 { subcontrol-origin: margin; border:1px solid rgb(240,241,239); height:30px; } QScrollBar::sub-line:vertical//為滾動條上面的箭頭區域 { subcontrol-origin: margin; border:1px solid rgb(240,241,239); height:30px; } QScrollBar::add-page:vertical//表示未滑過的槽部分 { background-color:rgb(240
,241,239);
} QScrollBar::sub-page:vertical //表示已滑過的槽部分 { background-color:rgb(240,241,239); } QScrollBar::up-arrow:vertical//箭頭 { border:0px; width:30px; height:30px; border-image:url(":/Icons/up_Arrow.png"); } QScrollBar::up-arrow:vertical:pressed { border:0px; width:30px; height:30px;
border-image:url(":/Icons/up_Arrow_down.png"); } QScrollBar::down-arrow:vertical { border:0px; width:30px; height:30px; border-image:url(":/Icons/down_Arrow.png"); } QScrollBar::down-arrow:vertical:pressed { border:0px; width:30px; height:30px; border-image:url(":/Icons/down_Arrow_down.png"); }

效果圖如下:
這裡寫圖片描述