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");
}

效果图如下:
这里写图片描述

你可能感兴趣的:(QT)