Qt 样式表参考

所有衍生的 QAbstractScrollArea ，包括 QTextEdit ，和 QAbstractItemView (所有项视图类)，支持可卷动背景使用 background-attachment . Setting the background-attachment to fixed provides a background-image that does not scroll with the viewport. Setting the background-attachment to scroll , scrolls the background-image when the scroll bars move.

见 定制 QAbstractScrollArea 范例。

警告： 确保定义 Q_OBJECT 宏为自定义 Widget。

The dock widget border can be styled using the border property. The ::title subcontrol can be used to customize the title bar. The close and float buttons are positioned with respect to the ::title subcontrol using the ::close-button and ::float-button 分别。

When the title bar is vertical, the :vertical pseudo class is set. In addition, depending on QDockWidget::DockWidgetFeature ， :closable , :floatable and :movable pseudo states are set.

注意： 使用 QMainWindow::separator 以样式化重置手柄大小。

警告： 样式表不起作用当 QDockWidget is undocked as Qt uses native top level windows when undocked.

见 定制 QDockWidget 范例。

从 4.3 起，设置样式表在 QLabel 自动设置 QFrame::frameStyle 特性到 QFrame::StyledPanel .

见 定制 QFrame 范例。

The sort indicator can be styled using the ::up-arrow 和 ::down-arrow 子控件。

见 定制 QHeaderView 范例。

样式化选中项的颜色和背景是使用 selection-color and selection-background-color 分别。

The password character can be styled using the lineedit-password-character 特性。

The password mask delay can be changed using the lineedit-password-mask-delay

见 定制 QLineEdit 范例。

Individual items are styled using the ::item subcontrol. In addition to the usually supported pseudo states, item 子控件支持 :selected , :default , :exclusive 和 non-exclusive 伪状态。

The indicator of checkable menu items is styled using the ::indicator 子控件。

The separator is styled using the ::separator 子控件。

For items with a sub menu, the arrow marks are styled using the right-arrow and left-arrow .

The scroller is styled using the ::scroller .

The tear-off is styled using the ::tearoff .

见 定制 QMenu 范例。

For QPushButton with a menu, the menu indicator is styled using the ::menu-indicator subcontrol. Appearance of checkable push buttons can be customized using the :open and :closed pseudo-states.

警告： If you only set a background-color on a QPushButton , the background may not appear unless you set the border property to some value. This is because, by default, the QPushButton draws a native border which completely overlaps the background-color. For example,

QPushButton { background-color: red; border: none; }
																							

见 定制 QPushButton 范例。

The slider can be styled using the ::handle subcontrol. Setting the min-width or min-height provides size contraints for the slider depending on the orientation.

The ::add-line subcontrol can be used to style the button to add a line. By default, the add-line subcontrol is placed in top right corner of the Border rectangle of the widget. Depending on the orientation the ::right-arrow or ::down-arrow . By default, the arrows are placed in the center of the Contents rectangle of the add-line subcontrol.

The ::sub-line subcontrol can be used to style the button to subtract a line. By default, the sub-line subcontrol is placed in bottom right corner of the Border rectangle of the widget. Depending on the orientation the ::left-arrow or ::up-arrow . By default, the arrows are placed in the center of the Contents rectangle of the sub-line subcontrol.

The ::sub-page subcontrol can be used to style the region of the slider that subtracts a page. The ::add-page subcontrol can be used to style the region of the slider that adds a page.

见 定制 QScrollBar 范例。

The groove of the slider is styled using the ::groove . The groove is positioned by default in the Contents rectangle of the widget. The thumb of the slider is styled using ::handle subcontrol. The subcontrol moves in the Contents rectangle of the groove subcontrol.

见 定制 QSlider 范例。

见 定制 QSplitter 范例。

The :top , :left , :right , :bottom pseudo states depending on the orientation of the tabs.

Overlapping tabs for the selected state are created by using negative margins or using the absolute position scheme.

The tear indicator of the QTabBar 的样式化是使用 ::tear 子控件。

QTabBar used two QToolButtons for its scrollers that can be styled using the QTabBar QToolButton selector. To specify the width of the scroll button use the ::scroller 子控件。

The alignment of the tabs within the QTabBar 的样式化是使用 alignment 特性。

警告：

要改变位置为 QTabBar 在 QTabWidget ，使用 tab-bar subcontrol (and set subcontrol-position).

见 Customizing QTabBar 范例。

样式化选中项的颜色和背景是使用 selection-color and selection-background-color 分别。

角落 Widget 在 QTableView 的实现如 QAbstractButton 且样式化可以使用 QTableView QTableCornerButton::section 选择器。

警告： 若仅设置 QTableCornerButton 背景颜色，背景可能不出现，除非将 border (边框) 特性设为某值。这是因为，默认情况下，QTableCornerButton 会绘制完全重叠背景色的本机边框。

栅格颜色的指定可以使用 gridline-color 特性。

见 QAbsractScrollArea 以样式化可卷动背景。

见 定制 QTableView 范例。

选中文本的颜色和背景的样式化是使用 selection-color and selection-background-color 分别。

见 QAbsractScrollArea 以样式化可卷动背景。

The :top , :left , :right , :bottom pseudo states depending on the area in which the tool bar is grouped.

The :first , :last , :middle , :only-one pseudo states indicator the position of the tool bar within a line group (See QStyleOptionToolBar::positionWithinLine ).

分隔符对于 QToolBar 的样式化是使用 ::separator 子控件。

(移动工具栏的) 手柄的样式化是使用 ::handle 子控件。

见 定制 QToolBar 范例。

The individual tabs can by styled using the ::tab subcontrol. The tabs support the :only-one , :first , :last , :middle , :previous-selected , :next-selected , :selected 伪状态。

样式化选中项的颜色和背景是使用 selection-color and selection-background-color 分别。

选定行为的控制是通过 show-decoration-selected 特性。

The branches of the tree view can be styled using the ::branch subcontrol. The ::branch Sub-control supports the :open , :closed , :has-sibling and :has-children 伪状态。

使用 ::item subcontrol for more fine grained control over the items in the QTreeView .

见 QAbsractScrollArea 以样式化可卷动背景。

见 定制 QTreeView for an example to style the branches.

若子类来自 QWidget ，需要提供 paintEvent 为自定义 QWidget 如下：

void CustomWidget::paintEvent(QPaintEvent *)
{
    QStyleOption opt;
    opt.init(this);
    QPainter p(this);
    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}
																																								

以上代码无操作，若未设置样式表。

警告： 确保定义 Q_OBJECT 宏为自定义 Widget。

若此特性未设置，将默认值设为调色板的 AlternateBase 角色。

范例：

QTreeView {
    alternate-background-color: blue;
    background: yellow;
}
																																									

另请参阅 background and selection-background-color .

范例：

QLabel { background-color: yellow }
QLineEdit { background-color: rgb(255, 0, 0) }
																																											

If this property is not specified, the background image is repeated in both directions ( repeat ).

范例：

QFrame {
    background: white url(:/images/ring.png);
    background-repeat: repeat-y;
    background-position: left;
}
																																											

范例：

QTextEdit {
    background-image: url("leaves.png");
    background-attachment: fixed;
}
																																											

另请参阅 background

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QDialog , QFrame , QGroupBox , QLabel , QPushButton , QRadioButton , QSplitter , QTextEdit , QToolTip ，和纯 QWidget s.

如果此特性未指定，默认为 padding .

范例：

QFrame {
    background-image: url(:/images/header.png);
    background-position: top left;
    background-origin: content;
}
																																													

另请参阅 background and Box 模型 .

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSplitter , QTextEdit , QToolTip ，和纯 QWidget s.

若此特性未指定，默认为 color (i.e., the widget's foreground color).

范例：

QLineEdit {
    border-width: 1px;
    border-style: solid;
    border-color: white;
}
																																														

另请参阅 border-style , border-width , border-image ，和 Box 模型 .

The border-radius clips the element's background .

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSplitter , QTextEdit ，和 QToolTip .

If this property is not specified, it defaults to 0.

范例：

QLineEdit {
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
}
																																																

另请参阅 border-width and Box 模型 .

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSplitter , QTextEdit ，和 QToolTip .

范例：

QLineEdit {
    border-width: 2px;
    border-style: solid;
    border-color: darkblue;
}
																																																		

另请参阅 border-color , border-radius , border-style , border-image ，和 Box 模型 .

若此特性未指定，默认为当前样式指定值对于 SH_DialogButtonLayout 样式提示。

范例：

* { button-layout: 2 }
																																																				

If this property is set to 1, the buttons of a QDialogButtonBox show icons; if it is set to 0, the icons are not shown.

见 图标列表 section for information on how to set icons.

QDialogButtonBox { dialogbuttonbox-buttons-have-icons: 1; }
																																																					

注意： Styles defining this property must be applied before the QDialogButtonBox is created; this means that you must apply the style to the parent widget or to the application itself.

范例：

QCheckBox { font-family: "New Century Schoolbook" }
																																																						

范例：

QTextEdit { font-style: italic }
																																																						

若此特性未指定，默认为当前样式指定值对于 SH_Table_GridLineColor 样式提示。

范例：

* { gridline-color: gray }
																																																						

使用此特性，可以设置下列 Widget 的图标大小。

• QCheckBox
• QListView
• QPushButton
• QRadioButton
• QTabBar
• QToolBar
• QToolBox
• QTreeView

若此特性未指定，默认为当前样式指定值对于 SH_LineEdit_PasswordCharacter 样式提示。

范例：

* { lineedit-password-character: 9679 }
																																																								

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSplitter , QTextEdit ，和 QToolTip .

若此特性未指定，默认为 0 .

范例：

QLineEdit { margin: 2px }
																																																								

另请参阅 padding , spacing ，和 Box 模型 .

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSizeGrip , QSpinBox , QSplitter , QStatusBar , QTextEdit ，和 QToolTip .

The value is relative to the contents rect in the Box 模型 .

范例：

QComboBox { max-width: 72px }
																																																										

另请参阅 max-height .

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSizeGrip , QSpinBox , QSplitter , QStatusBar , QTextEdit ，和 QToolTip .

If this property is not specified, the minimum height is derived based on the widget's contents and the style.

The value is relative to the contents rect in the Box 模型 .

范例：

QComboBox { min-height: 24px }
																																																											

另请参阅 min-width .

若此特性未指定，默认为当前样式指定值对于 SH_ToolTipLabel_Opacity 样式提示。

范例：

QToolTip { opacity: 223 }
																																																													

此特性的支持通过 QAbstractItemView 子类， QAbstractSpinBox 子类， QCheckBox , QComboBox , QFrame , QGroupBox , QLabel , QLineEdit , QMenu , QMenuBar , QPushButton , QRadioButton , QSplitter , QTextEdit ，和 QToolTip .

若此特性未指定，默认为 0 .

范例：

QLineEdit { padding: 3px }
																																																													

另请参阅 margin , spacing ，和 Box 模型 .

若此特性未指定，默认为 relative .

This property is supported by all widgets that respect the QWidget::palette and that show selection text.

若此特性未设置，将默认值设为调色板的 Highlight 角色。

范例：

QTextEdit { selection-background-color: darkblue }
																																																																

另请参阅 selection-color and background .

若此特性未指定，默认为当前样式指定值对于 SH_ItemView_ShowDecorationSelected 样式提示。

范例：

* { show-decoration-selected: 1 }
																																																																		

如果此特性未指定，默认为 padding .

范例：

QSpinBox::up-button {
    image: url(:/images/spinup.png);
    subcontrol-origin: content;
    subcontrol-position: right top;
}
																																																																			

另请参阅 subcontrol-position .

If this value is not specified, it defaults to the value that depends on the native style.

范例：

QPushButton {
    text-align: left;
}
																																																																					

此特性目前仅支持通过 QPushButton and QProgressBar .

若 position is absolute ， top property specifies the subcontrol's top edge in relation to the parent's top edge (see also subcontrol-origin ).

若此特性未指定，默认为 0 .

范例：

QSpinBox::up-button { top: 2px }
																																																																						

另请参阅 left , right ，和 bottom .

范例：

QTextEdit { background-position: bottom center }
																																																																								

范例：

QLabel { border-width: 1px }                    /* 1px 1px 1px 1px */
QLabel { border-width: 1px 2px }                /* 1px 2px 1px 2px */
QLabel { border-width: 1px 2px 3px }            /* 1px 2px 3px 2px */
QLabel { border-width: 1px 2px 3px 4px }        /* 1px 2px 3px 4px */
																																																																									

范例：

QLabel { border-color: red }                    /* opaque red */
QLabel { border-color: #FF0000 }                /* opaque red */
QLabel { border-color: rgba(255, 0, 0, 75%) }   /* 75% opaque red */
QLabel { border-color: rgb(255, 0, 0) }         /* opaque red */
QLabel { border-color: rgb(100%, 0%, 0%) }      /* opaque red */
QLabel { border-color: hsv(60, 255, 255) }      /* opaque yellow */
QLabel { border-color: hsva(240, 255, 255, 75%) }      /* 75% blue */
																																																																									

注意： The RGB colors allowed are the same as those allowed with CSS 2.1, as listed here .

范例：

* {
    file-icon: url(file.png),
               url(file_selected.png) selected;
  }
QMessageBox {
    dialogbuttonbox-buttons-have-icons: true;
    dialog-ok-icon: url(ok.svg);
    dialog-cancel-icon: url(cancel.png),
                        url(grayed_cancel.png) disabled;
}
																																																																										

例如，

QPushButton { color: palette(dark); }
																																																																												

• repeat-x : Repeat horizontally.
• repeat-y : Repeat vertically.
• repeat : Repeat horizontally and vertically.
• no-repeat : Don't repeat.