2021-07-05

Qt样式表属性

日期	作者	版本
2021年07月05日	Mister H	V1.0

目录

• Qt样式表属性
• • 选择器类型
  • 样式表语法

选择器类型

样式规则

QWidget{color:red}

QWidget是选择符，{color:red} 是声明，color 是属性，red 是值

选择符	实例	说明
通用选择符	*	匹配所有部件
类型选择符	QWidget	匹配所有QWidget实例和它的所有子类
类选择符	.QWidget	匹配所有QWidget实例但不包含它的子类
ID选择符	QWidget#okWidget	匹配所有QWidget中以okWidget为对象名的实例

样式表语法

1. 设置高、宽度。单位：像素（px）

代码如下（示例）：

width:12px;			//设置宽度 单位像素
height:40px  		//设置高度
min-width:65px;     //最小宽度 有些时候设置width无效可以尝试设置min-width                       
min-height:12px;    //最小高度                       
max-width:12px;
max-height:12px;  

2. 设置背景颜色 四种颜色表示方式

代码如下（示例）：

background-color:rgb(255,255,255);  
background-color:rgbs(255,255,255,30);  //最后一个参数是透明度  0~255
background-color:yellow     			//常用颜色名
background-color:#FF0000

2. 文本颜色

代码如下（示例）：

colo:rgb(255,255,255);   				//前景色 文本颜色
color: #F5F5F5;                         //前景(文本)颜色   

3. 边框

代码如下（示例）：

    border:3px solid red  //边框---可以分开设置 solid 实线 dotted 点状边框   none无边框    dashed 虚线
	border---四条边相同样式
	border-style 
	border-top-style
	border-right-style  
	border-bottom-style  
	border-left-style

	border-width 上 右 下 左  ----- 边框宽度	//3px 边框像素---宽度-单位：像素(px)
	border-top-width   
	border-right-width  
	border-bottom-width  
	border-left-width
	
	border: 1px solid #FDBC03;                   /* 边框:宽度 颜色*/  
	border-radius: 4px;                          /*边框圆角半径 */  
	border-top-left-radius: ;                    /* 角弧度:左上角*/  
	border-top-right-radius: ;                   /* 角弧度:右上角*/  
	border-bottom-left-radius: ;                 /* 角弧度:左下角*/  
	border-bottom-right-radius: ;                /* 角弧度:右下角*/  

	border-color:								//边框颜色 上 右 下 左
	border-top-color  
	border-right-color  
	border-bottom-color  
	border-left-color

4. 伪状态列表

代码如下（示例）：

:checked                        //button部件被选中
:unchecked                      //button部件未被选中
:disabled                       //部件被禁用
:enabled                        //部件被启用
:focus                          //部件获得焦点
:hover                          //鼠标位于部件上
:indeterminate                  //checkbox或radiobutton被部分选中
:off                            //部件可以切换，且处于off状态
:on                             //部件可以切换，且处于on状态
:pressed                        //部件被鼠标按下

5. 子部件

代码如下（示例）：

::down-arrow         //combo box或spin box的下拉箭头
::down-button        //spin box的向下按钮
::drop-down          //combo box的下拉箭头
::indicator          //checkbox、radio button或可选择group box的指示器
::item               //menu、menu bar或status bar的子项目
::menu-indicator     //push button的菜单指示器
::title              //group box的标题
::up-arrow           //spin box的向上箭头
::up-button          //spin box的向上按钮

以上是Qt一些常用的qss语法，其中没有包括单独控件的，比如：QComboBox、QSlider等，这些等以后工作中使用到了，会陆续追加。