Qss界面美化3:QTableWidget美化

Qss界面美化3:QTableWidget美化(通过liudianwu 刘大神的开源示例学习)

先看效果图:
Qss界面美化3:QTableWidget美化_第1张图片

思路:通过qss代码对QTabelWidget中的css属性进行改变(table右侧是一个滑动条)

关键代码:

/*
tabelwidget*/
QTableWidget{
color:#DCDCDC;
background:#444444;
border:1px solid #242424;
alternate-background-color:#525252;/*交错颜色*/
gridline-color:#242424;
}

/*选中item*/
QTableWidget::item:selected{
color:#DCDCDC;
background:qlineargradient(spread:pad,x1:0,y1:0,x2:0,y2:1,stop:0 #484848,stop:1 #383838);
}

/*
悬浮item*/
QTableWidget::item:hover{
background:#5B5B5B;
}
/*表头*/
QHeaderView::section{
text-align:center;
background:#5E5E5E;
padding:3px;
margin:0px;
color:#DCDCDC;
border:1px solid #242424;
border-left-width:0;
}



/*表右侧的滑条*/
QScrollBar:vertical{
background:#484848;
padding:0px;
border-radius:6px;
max-width:12px;
}

/*滑块*/
QScrollBar::handle:vertical{
background:#CCCCCC;
}
/*
滑块悬浮,按下*/
QScrollBar::handle:hover:vertical,QScrollBar::handle:pressed:vertical{
background:#A7A7A7;
}
/*
滑块已经划过的区域*/
QScrollBar::sub-page:vertical{
background:444444;
}

/*
滑块还没有划过的区域*/
QScrollBar::add-page:vertical{
background:5B5B5B;
}

/*页面下移的按钮*/
QScrollBar::add-line:vertical{
background:none;
}
/*页面上移的按钮*/
QScrollBar::sub-line:vertical{
background:none;
}

你可能感兴趣的:(QSS界面美化)