1 QPushButton { 2 /* 前景色 */
3 color:red; 4
5 /* 背景色 */
6 background-color:rgb(30,75,10); 7
8 /* 边框风格 */
9 border-style:outset; 10
11 /* 边框宽度 */
12 border-width:2px; 13
14 /* 边框颜色 */
15 border-color:rgb(10,45,110); 16
17 /* 边框倒角 */
18 border-radius:10px; 19
20 /* 字体 */
21 font:bold 14px; 22
23 /* 控件最小宽度 */
24 min-width:100px; 25
26 /* 控件最小高度 */
27 min-height:20px; 28
29 /* 内边距 */
30 padding:4px; 31 } 32
33 /* 鼠标按下时的效果 */
34 QPushButton#pushButton:pressed { 35 /* 改变背景色 */
36 background-color:rgb(40,85,20); 37
38 /* 改变边框风格 */
39 border-style:inset; 40
41 /* 使文字有一点移动 */
42 padding-left:6px; 43 padding-top:6px; 44 } 45
46 /* 按钮样式 */
47 QPushButton:flat { 48 border:2px solid red; 49 } 50
51 /* 当按钮打开菜单时:ui->pushButton->setMenu(btnMenu) */
52 QPushButton:open{ 53 background-color:qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 1 #f6f7fa); 54 } 55
56 /* 子选择器:菜单 */
57 QPushButton::menu-indicator { 58 image:url(:/images/close.png); 59
60 /* 去掉小三角号 61 image:none;*/
62
63 /* 绘制subcontrol 的参考矩形的位置 */
64 subcontrol-origin:padding; 65
66 /* 小三角的位置 */
67 subcontrol-position:bottom right; 68 } 69
70 QPushButton::menu-indicator:pressed,QPushButton::menu-indicator:open { 71 position:relative; 72 top:4px; 73 left:4px; 74 }
前景色 color:rgb(255, 0, 0)
1 QPushButton *btn = new QPushButton("我叫按钮"); 2 btn->setStyleSheet( QString("QPushButton{color:rgb(255, 0, 0)} \
3 QPushButton:hover{color:rgb(0, 255, 0)} \ 4 QPushButton:pressed{color:rgb(0, 0, 255)}") );
5 btn->show();
效果如下：
按钮上的字初始颜色是红色
鼠标移到按钮上后，按钮按钮上字的颜色变成绿色
鼠标点击后，按钮按钮上字的颜色变成蓝色
背景色 background-color:rgb(255, 0, 0)
1 QPushButton *btn = new QPushButton("我叫按钮"); 2 btn->setStyleSheet( QString("QPushButton{background-color:rgb(255, 0, 0)} \
3 QPushButton:hover{background-color:rgb(0, 255, 0)} \ 4 QPushButton:pressed{background-color:rgb(0, 0, 255)}") );
5 btn->show();
效果如下：
按钮初始背景色是红色
鼠标移到按钮上后，按钮背景色变成绿色
鼠标点击后，按钮背景色变成蓝色
边框风格 border:2px solid red
调整边框风格时，border-width >= 1。否则不管怎么调整，都看不出效果
| border-style属性值 | 含义 |
|---|---|
| none | 定义无边框。 |
| hidden | 与 “none” 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。 |
| dotted | 定义点状边框。在大多数浏览器中呈现为实线。 |
| dashed | 定义虚线。在大多数浏览器中呈现为实线。 |
| solid | 定义实线。 |
| double | 定义双线。双线的宽度等于 border-width 的值。 |
| groove | 定义 3D 凹槽边框。其效果取决于 border-color 的值。 |
| ridge | 定义 3D 垄状边框。其效果取决于 border-color 的值。 |
| inset | 定义 3D inset 边框。其效果取决于 border-color 的值。 |
| outset | 定义 3D outset 边框。其效果取决于 border-color 的值。 |
| inherit | 规定应该从父元素继承边框样式。 |
1 QPushButton *btn = new QPushButton("我叫按钮"); 2 btn->setStyleSheet( QString("QPushButton{border:2px solid #ff0000} \
3 QPushButton:hover{border:5px dotted #00ff00} \ 4 QPushButton:pressed{border:10px groove #0000ff}") );
5 btn->show();
效果如下：
按钮初始为普通红色边框
鼠标移到按钮上后，按钮边框变成绿色点状边框
鼠标点击按钮后，按钮边框变成蓝色3D 凹槽边框
边框倒角 border-radius:2px
1 QPushButton *btn = new QPushButton("我叫按钮"); 2 btn->setStyleSheet( QString("QPushButton{ border:2px solid red; \
3 border-top-left-radius:4px; \ 4 border-top-right-radius:8px; \ 5 border-bottom-left-radius:16px; \ 6 border-bottom-right-radius:32px } \ 7 QPushButton:hover{border:5px dotted #00ff00} \ 8 QPushButton:pressed{border:10px groove #0000ff}") );
9 btn->show();
效果如下：