一套简约的qt 蓝色qss方案

一套简约的qt 蓝色qss方案

直接使用qss代码

1. QMenu
2. {
3.     background: qlineargradient(x1:0, y1:0, x2:0, y2:1,
4.     stop:0 rgba(255, 255, 255, 240),
5.     stop:0.2 rgba(255, 255, 255, 200),
6.     stop:0.6 rgba(255, 255, 255, 160),
7.     stop:1 rgba(255, 255, 255, 120));
8.     qproperty-effect: blur(30px);
9.     border-radius: 10px;
10.     padding:4px 2px;
11.     margin:4px 2px;
12. }
13. QMenu::item
14. {
15.     background-color: transparent;
16.     padding:2px 15px;
17.     margin:2px 2px;
18.     height: 30px; /* 设置item的高度 */
19.     border-radius: 4px;
20. }
21. QMenu::item:selected
22. {
23.     background-color: rgb(55,144,250);
24. }
26. /* 普通状态 */
27. QPushButton {
28.     background-color: rgb(220,220,220);/* 设置背景颜色 */
29.     border: 1px solid rgb(200,200,200); /* 设置边框 */
30.     border-radius: 10px;
31.     min-height: 25px;
32.     color: #000000; /* 设置文字颜色 */
33.     padding:4px 20px;
34.     margin:4px 4px;
35. }
37. /* 鼠标悬停状态 */
38. QPushButton:hover {
39.     background-color: rgb(55,144,250); /* 设置悬停时的背景颜色 */
40.     color: #ffffff; /* 设置悬停时的文字颜色 */
41. }
43. /* 按下状态 */
44. QPushButton:pressed {
45.     background-color: rgb(44,133,240); /* 设置按下时的背景颜色 */
46.     color: #ffffff; /* 设置按下时的文字颜色 */
47. }
49. /* 复选框选中状态 */
50. QPushButton:checked {
51.     background-color: rgb(55,144,250);  /* 设置选中时的背景颜色 */
52.     color: #ffffff; /* 设置选中时的文字颜色 */
53. }
55. /* 按钮被选中状态 */
56. QPushButton:pressed:checked {
57.     background-color: rgb(44,133,240); /* 设置按钮被选中时的背景颜色 */
58.     color: #ffffff; /* 设置按钮被选中时的文字颜色 */
59. }
63. QSlider::groove:horizontal {
64.     border: 1px solid #bbb; /* 设置滑块轨道的边框 */
65.     background: white; /* 设置滑块轨道的背景颜色 */
66.     height: 8px; /* 设置滑块轨道的高度 */
67.     margin: 2px 0; /* 设置滑块轨道与滑块的间距 */
68.     border-radius: 4px; /* 设置滑块轨道的圆角 */
69. }
71. QSlider::handle:horizontal {
72.     background: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0 #eee, stop:1 #ccc); /* 设置滑块的背景渐变色 */
73.     border: 1px solid #777; /* 设置滑块的边框 */
74.     width: 14px; /* 设置滑块的宽度 */
75.     margin: -2px 0; /* 设置滑块的边距 */
76.     border-radius: 7px; /* 设置滑块的圆角 */
77. }
79. QSlider::handle:horizontal:hover {
80.     background: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0 #fff, stop:1 #ddd); /* 设置鼠标悬停时滑块的背景渐变色 */
81.     border: 1px solid #888; /* 设置鼠标悬停时滑块的边框 */
82. }
84. QSlider::sub-page:horizontal {
85.     background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #b9d6ff, stop:1 #add6ff); /* 设置已选择的部分的背景渐变色 */
86.     border: 1px solid #999; /* 设置已选择的部分的边框 */
87.     height: 8px; /* 设置已选择的部分的高度 */
88.     border-radius: 4px; /* 设置已选择的部分的圆角 */
89. }
91. QSlider::add-page:horizontal {
92.     background: #f0f0f0; /* 设置未选择的部分的背景颜色 */
93.     border: 1px solid #999; /* 设置未选择的部分的边框 */
94.     height: 8px; /* 设置未选择的部分的高度 */
95.     border-radius: 4px; /* 设置未选择的部分的圆角 */
96. }
98. QComboBox {
99.     border-radius: 5px; /* 设置圆角 */
100.     border: 1px solid #c0c0c0; /* 设置边框 */
101.     padding: 5px; /* 设置内边距 */
102.     background-color: #f0f0f0; /* 设置背景颜色 */
103. }
105. QComboBox::drop-down {
106.     border-top-right-radius: 5px; /* 设置下拉箭头右上角的圆角 */
107.     border-bottom-right-radius: 5px; /* 设置下拉箭头右下角的圆角 */
108.     border-left: 1px solid #c0c0c0; /* 设置下拉箭头左边的边框 */
109.     background-color: #f0f0f0; /* 设置下拉箭头背景色 */
110. }
112. QComboBox::down-arrow:on {
113.     top: 1px; /* 设置下拉箭头悬停时的位置 */
114.     left: 1px; /* 设置下拉箭头悬停时的位置 */
115. }
117. QComboBox::down-arrow:on {
118.     top: 1px;
119.     left: 1px;
120. }
122. QComboBox::item:selected {
123.     background-color: rgb(55,144,250); /* 设置选中项的背景色为蓝色 */
124.     color: white; /* 设置选中项的文本颜色为白色 */
125.     padding-left:0px; /* 设置选项的左边距 */
126.     text-align: center; /* 将选项居中显示 */
127.     border-radius: 5px; /* 设置圆角 */
128. }
129. QComboBox QAbstractItemView {
130.     border-bottom-right-radius: 5px;
131.     border-bottom-left-radius: 5px;
132. }
134. QLineEdit {
135.     border: 1px solid #c0c0c0; /* 设置边框 */
136.     border-radius: 5px; /* 设置边框的圆角半径 */
137.     padding: 3px; /* 设置内边距 */
138.     background-color: #f0f0f0; /* 设置背景颜色 */
139.     selection-color: white; /* 设置选中文本的颜色 */
140.     selection-background-color: blue; /* 设置选中文本的背景色 */
141. }
143. QLineEdit:focus {
144.     border: 2px solid #0078d7; /* 设置获取焦点时的边框颜色 */
145. }
148. QCheckBox::indicator {
149.     width: 15px; /* 设置复选框的宽度 */
150.     height: 15px; /* 设置复选框的高度 */
151. }
153. QCheckBox {
154.     spacing: 5px; /* 设置复选框和文本之间的间距 */
155. }
157. QCheckBox::indicator::unchecked {
158.     border: 2px solid #c0c0c0; /* 设置未选中时的边框样式 */
159.     border-radius: 5px; /* 设置未选中时的边框圆角 */
160. }
162. QCheckBox::indicator::checked {
163.     border: 2px solid #0078d7; /* 设置选中时的边框样式 */
164.     background-color: #0078d7; /* 设置选中时的背景颜色 */
165.     border-radius: 5px; /* 设置未选中时的边框圆角 */
166. }

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。