属性 | 说明 |
---|---|
background | 在一个声明中设置所有的背景属性。 |
background-attachment | 设置背景图像是否固定或者随着页面的其余部分滚动。 |
background-color | 设置元素的背景颜色。 |
background-image | 设置元素的背景图像。 |
background-position | 设置背景图像的开始位置。 |
background-repeat | 设置是否及如何重复背景图像。 |
background-clip | 规定背景的绘制区域。 |
background-origin | 规定背景图片的定位区域。 |
background-size | 规定背景图片的尺寸。 |
属性 | 说明 |
---|---|
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 | 向方框添加一个或多个阴影。 |
属性 | 说明 |
---|---|
overflow-x | 如果内容溢出了元素内容区域,是否对内容的左/右边缘进行裁剪。 |
overflow-y | 如果内容溢出了元素内容区域,是否对内容的上/下边缘进行裁剪。 |
overflow-style | 规定溢出元素的首选滚动方法。 |
rotation | 围绕由 rotation-point 属性定义的点对元素进行旋转。 |
rotation-point | 定义距离上左边框边缘的偏移点。 |
属性 | 说明 |
---|---|
font | 在一个声明中设置所有字体属性 |
font-family | 规定文本的字体系列。 |
font-size | 规定文本的字体尺寸。 |
font-size-adjust | 为元素规定 aspect 值。 |
font-stretch | 收缩或拉伸当前的字体系列。 |
font-style | 规定文本的字体样式。 |
font-variant | 规定是否以小型大写字母的字体显示文本。 |
font-weight | 规定字体的粗细。 |
属性 | 说明 |
---|---|
margin | 在一个声明中设置所有外边距属性。 |
margin-bottom | 设置元素的下外边距。 |
margin-left | 设置元素的左外边距。 |
margin-right | 设置元素的右外边距。 |
margin-top | 设置元素的上外边距。 |
属性 | 说明 |
---|---|
padding | 在一个声明中设置所有内边距属性。 |
padding-bottom | 设置元素的下内边距。 |
padding-left | 设置元素的左内边距。 |
padding-right | 设置元素的右内边距。 |
padding-top | 设置元素的上内边距。 |
属性 | 说明 |
---|---|
bottom | 设置定位元素下外边距边界与其包含块下边界之间的偏移。 |
clear | 规定元素的哪一侧不允许其他浮动元素。 |
clip | 剪裁绝对定位元素。 |
cursor | 规定要显示的光标的类型(形状)。 |
display | 规定元素应该生成的框的类型。 |
float | 规定框是否应该浮动。 |
left | 设置定位元素左外边距边界与其包含块左边界之间的偏移。 |
overflow | 规定当内容溢出元素框时发生的事情。 |
position | 规定元素的定位类型。 |
right | 设置定位元素右外边距边界与其包含块右边界之间的偏移。 |
top | 设置定位元素的上外边距边界与其包含块上边界之间的偏移。 |
vertical-align | 设置元素的垂直对齐方式。 |
visibility | 规定元素是否可见。 |
z-index | 设置元素的堆叠顺序。 |
属性 | 说明 |
---|---|
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 | 允许对长的不可分割的单词进行分割并换行到下一行。 |
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的对象.
原则:宽泛的设置优先级低于更加针对具体的设置,文件上面的设置优先级低于文件下面的设置。
aqua, black, blue, fuchsia, gray, green, lime, maroon,navy, olive, orange, purple, red, silver, teal, white, yellow
名称 | 表示 |
---|---|
微软雅黑 | Microsoft YaHei |
宋体 | SimSun |
黑体 | SimHei |
仿宋 | FangSong |
楷体 | KaiTi |
隶书 | LiSu |
幼圆 | YouYuan |
华文细黑 | STXihei |
华文楷体 | STKaiti |
华文宋体 | STSong |
华文中宋 | STZhongsong |
华文仿宋 | STFangsong |
方正舒体 | FZShuTi |
方正姚体 | FZYaoti |
华文彩云 | STCaiyun |
华文琥珀 | STHupo |
华文隶书 | STLiti |
华文行楷 | STXingkai |
华文新魏 | STXinwei |
1、 选择器
{property:value}
Qt中有很多控件,例如 QPushButton、 QWidget等被称为选择器,== {property:value}==代表属性和值。
QPushButton {color: red} //代表QPushButton 颜色为红色
2、几个选择器可以指定相同的声明,使用==逗号“,”==来分隔选择器
//代表QPushButton ,QLineEdit,QComboBox 颜色为红色
QPushButton,QLineEdit,QComboBox {color: red}
3、声明部分的规则有多个属性值时包含在花括号{}中,以分号;分隔,属性之间在QSS之间是不区分大小写的。
QPushButton {color: red;background-color:white;}
setStyleSheet();
伪状态 | 描述 |
---|---|
: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 | 小部件是一个窗口(例如,一个顶层小部件) |