Qt中QSS样式属性介绍

QSS就是Qt Style Sheets，也就是Qt样式表，它是Qt提供的一种用来自定义控件外观的机制。QSS大量参考了CSS的内容，只不过QSS的功能比CSS要弱很多，体现在选择器要少，可以使用的QSS属性也要少很多，并且并不是所有的属性都可以用在Qt的所有控件上。但实际项目中一般的需求，通过QSS样式设置都可以满足。
以下先介绍Qt中的常用控件在QSS样式有哪些属性。

1.Qss背景属性(Background)

background 在一个声明中设置所有的背景属性。
background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。
background-color 设置元素的背景颜色。
background-image 设置元素的背景图像。
background-position 设置背景图像的开始位置。
background-repeat 设置是否及如何重复背景图像。
background-clip 规定背景的绘制区域。
background-origin 规定背景图片的定位区域。
background-size 规定背景图片的尺寸。

2.QSS边框属性(Border和Outline)

border 在一个声明中设置所有的边框属性。
border-bottom 在一个声明中设置所有的下边框属性。
border-bottom-color 设置下边框的颜色。
border-bottom-style 设置下边框的样式。
border-bottom-width 设置下边框的宽度。
border-color 设置四条边框的颜色。
border-left 在一个声明中设置所有的左边框属性。
border-left-color 设置左边框的颜色。
border-left-style 设置左边框的样式。
border-left-width 设置左边框的宽度。
border-right 在一个声明中设置所有的右边框属性。
border-right-color 设置右边框的颜色。
border-right-style 设置右边框的样式。
border-right-width 设置右边框的宽度。
border-style 设置四条边框的样式。
border-top 在一个声明中设置所有的上边框属性。
border-top-color 设置上边框的颜色。
border-top-style 设置上边框的样式。
border-top-width 设置上边框的宽度。
border-width 设置四条边框的宽度。
outline 在一个声明中设置所有的轮廓属性。
outline-color 设置轮廓的颜色。
outline-style 设置轮廓的样式。
outline-width 设置轮廓的宽度。
border-bottom-left-radius 定义边框左下角的形状。
border-bottom-right-radius 定义边框右下角的形状。
border-image 简写属性，设置所有 border-image-属性。
border-image-outset 规定边框图像区域超出边框的量。
border-image-repeat 图像边框是否应平铺(repeated)、铺满(rounded)或拉伸(stretched)。
border-image-slice 规定图像边框的向内偏移。
border-image-source 规定用作边框的图片。
border-image-width 规定图片边框的宽度。
border-radius 简写属性，设置所有四个border--radius属性。
border-top-left-radius 定义边框左上角的形状
border-top-right-radius 定义边框右下角的形状。
box-decoration-break 元素在发生断行时其样式的表现形式
box-shadow 向方框添加一个或多个阴影。

3.Box属性

overflow-x 如果内容溢出了元素内容区域，是否对内容的左/右边缘进行裁剪。
overflow-y 如果内容溢出了元素内容区域，是否对内容的上/下边缘进行裁剪。
overflow-style 规定溢出元素的首选滚动方法。
rotation 围绕由 rotation-point 属性定义的点对元素进行旋转。
rotation-point 定义距离上左边框边缘的偏移点。

4.QSS字体属性(Font)

font 在一个声明中设置所有字体属性
font-family 规定文本的字体系列。
font-size 规定文本的字体尺寸。
font-size-adjust 为元素规定 aspect 值。
font-stretch 收缩或拉伸当前的字体系列。
font-style 规定文本的字体样式。
font-variant 规定是否以小型大写字母的字体显示文本。
font-weight 规定字体的粗细。

5.QSS外边距属性(Margin)

margin 在一个声明中设置所有外边距属性。
margin-bottom 设置元素的下外边距。
margin-left 设置元素的左外边距。
margin-right 设置元素的右外边距。
margin-top 设置元素的上外边距。

6.QSS内边距属性(Padding)

padding 在一个声明中设置所有内边距属性。
padding-bottom 设置元素的下内边距。
padding-left 设置元素的左内边距。
padding-right 设置元素的右内边距。
padding-top 设置元素的上内边距。

7.QSS 位属性(Positioning)

bottom 设置定位元素下外边距边界与其包含块下边界之间的偏移。
clear 规定元素的哪一侧不允许其他浮动元素。
clip 剪裁绝对定位元素。
cursor 规定要显示的光标的类型（形状）。
display 规定元素应该生成的框的类型。
float 规定框是否应该浮动。
left 设置定位元素左外边距边界与其包含块左边界之间的偏移。
overflow 规定当内容溢出元素框时发生的事情。
position 规定元素的定位类型。
right 设置定位元素右外边距边界与其包含块右边界之间的偏移。
top 设置定位元素的上外边距边界与其包含块上边界之间的偏移。
vertical-align 设置元素的垂直对齐方式。
visibility 规定元素是否可见。
z-index 设置元素的堆叠顺序。

8.QSS文本属性(Text)

color 设置文本的颜色。
direction 规定文本的方向/书写方向
letter-spacing 设置字符间距。
line-height 设置行高。
text-align 规定文本的水平对齐方式。
text-decoration 规定添加到文本的装饰效果。
text-indent 规定文本块首行的缩进。
text-shadow 规定添加到文本的阴影效果。
text-transform 控制文本的大小写。
unicode-bid 设置文本方向。
white-space 规定如何处理元素中的空白。
word-spacing 设置单词间距。
hanging-punctuation 规定标点字符是否位于线框之外。
punctuation-trim 规定是否对标点字符进行修剪。
text-align-last 设置如何对齐最后一行或紧挨着强制换行符之前的行。
text-emphasis 向元素的文本应用重点标记以及重点标记的前景色。
text-justify 规定当text-align设置为"justify"时所使用的对齐方法。
text-outline 规定文本的轮廓。
text-overflow 规定当文本溢出包含元素时发生的事情。
text-shadow 向文本添加阴影。
text-wrap 规定文本的换行规则。
word-break 规定非中日韩文本的换行规则。
word-wrap 允许对长的不可分割的单词进行分割并换行到下一行。

9.QSS过滤选择器和优先级

1、 通配选择器：*; 所有的控件属性设置
*{ }
2、类型选择器：QPushButton; 匹配所有QPushButton和其子类的实例
QPushButton{}
3、类选择器：.QPushButton; 匹配所有QPushButton的实例，不包括其子类。注意前面有一个点
.QPushButton{}
4、属性选择器：QPushButton[flat = “false”]; 匹配所有flat属性是false的QPushButton实例，注意该属性可以是自定义的属性，不一定非要是类本身具有的属性
QPushButton[flat = “false”]{}
5、ID选择器：#myButton; 匹配所有id为myButton的控件实例，这里的id实际上就是objectName指定的值, 针对特定名称的控件设置属性
QPushButton#myButton1, #myButton2{}
6、后代选择器：QDialog QPushButton; 所有QDialog容器中包含的QPushButton，不管是直接的还是间接的。
QDialog QPushButton{}
7、子选择器：QDialog > QPushButton; 所有QDialog容器下面的QPushButton，其中要求QPushButton的直接父容器是QDialog
QDialog > QPushButton{}
注意：
以上选择器可以联合使用,并且支持一次设置多个选择器类型==,用逗号隔开，如#object1，#object2，#object3表示所有这个ID使用同个规则；QDialog #object1表示选择所有QDialog下所有ID为object1的对象。

10.QSS伪状态集合

:active 此状态在小部件驻留在活动窗口时设置
:adjoins-item 此状态在QTreeView的::branch与一个item相邻时设置
:alternate 当QAbstractItemView::alternatingRowColors()设置为真时，在绘制QAbstractItemView的行时，为每个交替行设置此状态
:bottom 此item位于底部。例如，QTabBar有位于底部的选项卡
:checked 此item被选中。例如，QAbstractButton的checked状态
:closable 此item可以被关闭。例如，QDockWidget的QDockWidget::DockWidgetClosable特性开启时
:closed 此item处于关闭状态。例如，QTreeView中未展开的item
:default 此item的默认状态。例如，一个default的QPushButton或QMenu中的一个默认动作
:disabled 此item被禁用
:editable 如QComboBox是可编辑的
:edit-focus 此item具有编辑焦点(参考QStyle::State_HasEditFocus)。此状态仅对Qt扩展应用程序可用
:enabled 此item已启用
:exclusive 此item是一个独占项组的一部分。例如，独占QActionGroup中的菜单项
:first 此item是列表中的第一项。例如，QTabBar中的第一个选项卡
:flat 此item是平的。例如，一个扁平的QPushButton
:floatable 此item可以浮动。例如，QDockWidget的QDockWidget::DockWidgetFloatable的特性开启时
:focus 此item具有输入焦点
:has-children 此item具有子对象。例如，QTreeView中具有子项的项
:has-sibling 此item具有兄弟对象。例如，QTreeView中与之相邻的项
:horizontal 此item处于水平方向
:hover 鼠标悬浮在此item上
:indeterminate 此item处于不确定状态。例如，QCheckBox或QRadioButton被部分选中
:last 此item是列表中的最后一项。例如，QTabBar中的最后一个选项卡
:left 此item位于左侧。例如，QTabBar有位于左侧的选项卡
:maximized 此item处于最大化状态。例如，一个最大化的QMdiSubWindow
:middle 此item是列表中的中间一项。例如，一个不在QTabBar中的开头或结尾的选项卡
:minimized 此item处于最小化状态。例如，一个最小化的QMdiSubWindow
:movable 此item可以被移动。例如， QDockWidget的QDockWidget::DockWidgetMovable特性开启时
:no-frame 此item没有边框。例如，没有边框的QSpinBox或Q LineEdit
:non-exclusive 此item是一个非独占项组的一部分。例如，非独占QActionGroup中的菜单项
:off 对可以切换的items，这适用于处于off状态的item
:on 对可以切换的items，这适用于处于on状态的widget
:only-one 此item是列表中的唯一的一项。例如，一个在QTabBar中单独的选项卡
:open 此item处于打开状态。例如，QTreeView中的展开项，或带有菜单的QComboBox或QPushButton
:next-selected 此item是列表中的下一个被选中的项。例如，在QTabBar中当前选项卡的下一个要选中的选项卡
:pressed 鼠标正在按压在此item上
:previous-selected 此item是列表中的上一个被选中的项。例如，在QTabBar中当前选项卡的上一个要选中的选项卡
:read-only 此item处于只读或不可编辑状态。例如，一个只读QLineEdit或不可编辑的QComboBox
:right 此item位于右侧。例如，QTabBar有位于右侧的选项卡
:selected 此item处于选中状态。例如，一个在QTabBar中被选中的选项卡或一个在菜单中被选中的菜单项
:top 此item位于顶部。例如，QTabBar有位于顶部的选项卡
:unchecked 此item处于未被选中状态
:vertical 此item处于垂直方向
:window 小部件是一个窗口(例如，一个顶层小部件)