QScrollArea样式美化
QScrollArea 样式美化:
说明:horizontal:⽔平滚动条,vertical:垂直滚动条,需要换为⽔平滚动条设置只需要将vertical替换为horizontal即可整个垂直滚动条区域样式
QScrollBar:vertical{ }
滚动条上⾯和下⾯区域样式
QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical{ }
滑块区域样式
QScrollBar::handle:vertical{ }
⿏标滑过滑块样式
QScrollBar::handle:vertical:hover,QScrollBar::handle:vertical:pressed{ }
向上箭头样式
QScrollBar::sub-line:vertical{ }
向上箭头滑过、摁下样式
QScrollBar::sub-line:vertical:hover,QScrollBar::sub-line:vertical:pressed{ }
向下箭头样式
QScrollBar::add-line:vertical{ }
向下箭头滑过、摁下样式
QScrollBar::add-line:vertical:hover,QScrollBar::add-line:vertical:pressed{ }
例⼦(⽹易云⾳乐的左边歌单选项卡):
QScrollArea{
border: 0px solid;
border-right-width: 1px;
border-right-color: #dcdbdc;
background-color: #f5f5f7;
}
QScrollBar:vertical {
border: none;
background: #f5f5f7;
width: 10px;
margin: 0px 0 0px 0;
}
QScrollBar::handle:vertical {
background: Gainsboro;html横向滚动条样式
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;
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。