72 lines
1.7 KiB
Plaintext
72 lines
1.7 KiB
Plaintext
|
||
/**********首先指定是水平还是竖直*不添加此代码，下方不起作用******/
|
||
QSlider::groove:horizontal {
|
||
border: 0px solid #bbb;
|
||
}
|
||
/*1.滑动过的槽设计参数*/
|
||
QSlider::sub-page:horizontal {
|
||
/*槽颜色*/
|
||
background: #05A6EC;
|
||
/*外环区域倒圆角度*/
|
||
border-radius: 4px;
|
||
/*上遮住区域高度*/
|
||
margin-top:8px;
|
||
/*下遮住区域高度*/
|
||
margin-bottom:8px;
|
||
/*width在这里无效，不写即可*/
|
||
}
|
||
|
||
/*2.未滑动过的槽设计参数*/
|
||
QSlider::add-page:horizontal {
|
||
/*槽颜色*/
|
||
background: #ECEBEB;
|
||
/*外环大小0px就是不显示，默认也是0*/
|
||
border: 0px solid #777;
|
||
/*外环区域倒圆角度*/
|
||
border-radius: 4px;
|
||
/*上遮住区域高度*/
|
||
margin-top:9px;
|
||
/*下遮住区域高度*/
|
||
margin-bottom:9px;
|
||
}
|
||
|
||
/*3.平时滑动的滑块设计参数*/
|
||
/3.1**********使用纯代码实现*****/
|
||
QSlider::handle:horizontal {
|
||
/*滑块颜色*/
|
||
background: rgb(255,255,255);
|
||
/*滑块的宽度*/
|
||
width: 30px;
|
||
/*滑块外环为1px，再加颜色*/
|
||
border: 1px solid #05A6EC;
|
||
/*滑块外环倒圆角度*/
|
||
border-radius: 15px;
|
||
/*上遮住区域高度*/
|
||
margin-top:0px;
|
||
/*下遮住区域高度*/
|
||
margin-bottom:0px;
|
||
}
|
||
|
||
/*********使用背景图的方式添加滑块***********/
|
||
QSlider::handle:horizontal {
|
||
width: 30px;
|
||
background:transparent;
|
||
background-image: url(:/DependFile/Source/channel/slder.png);
|
||
margin: -5px -0px -0px -0px;
|
||
}
|
||
|
||
/*4.手动拉动时显示的滑块设计参数*/
|
||
QSlider::handle:horizontal:hover {
|
||
/*滑块颜色*/
|
||
background: rgb(193,204,208);
|
||
/*滑块的宽度*/
|
||
width: 30px;
|
||
/*滑块外环为1px，再加颜色*/
|
||
border: 1px solid rgb(193,204,208);
|
||
/*滑块外环倒圆角度*/
|
||
border-radius: 5px;
|
||
/*上遮住区域高度*/
|
||
margin-top:4px;
|
||
/*下遮住区域高度*/
|
||
margin-bottom:4px;
|
||
} |