Référence sur les feuilles de style Qt

Les feuilles de style Qt prennent en charge diverses propriétés, pseudo-états et sous-contrôles qui permettent de personnaliser l'apparence des widgets.

Liste des widgets personnalisables

Le tableau suivant répertorie les Qt Widgets pouvant être personnalisés à l'aide de feuilles de style :

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

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

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

Liste des propriétés

Cette section répertorie toutes les propriétés prises en charge par Qt Style Sheets. Les valeurs pouvant être attribuées à une propriété dépendent du type de celle-ci. Sauf indication contraire, les propriétés suivantes s'appliquent à tous les widgets. Les propriétés marquées d'un astérisque * sont spécifiques à Qt et n'ont pas d'équivalent en CSS2 ou CSS3. Les propriétés spécifiques à Qt sont les suivantes :

• gridline-color*
• image*
• lineedit-password-character*
• lineedit-password-mask-delay*
• indicateurs d'interaction du texte de la boîte de message*
• opacité*
• couleur-du-texte-de-remplacement*
• couleur-d'arrière-plan-de-la-sélection*
• couleur-de-sélection*
• afficher-la-décoration-de-la-sélection*
• espacement*
• origine-du-sous-contrôle*
• position-du-sous-contrôle*
• durée-d’animation-du-widget*

couleur-de-l’accent

Cette propriété définit la couleur « Accent », utilisée pour mettre en évidence les éléments interactifs de l’interface utilisateur. Si cette propriété n’est pas définie, la valeur par défaut est la couleur « highlight ».

alternate-background-color

L'alternate background color e utilisé dans les sous-classes de ` QAbstractItemView `.

Si cette propriété n'est pas définie, la valeur par défaut correspond à celle définie pour le rôle d'AlternateBase de la palette.

Exemple :

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

Voir également background et selection-background-color.

background

Notation abrégée permettant de définir l'arrière-plan. Équivaut à spécifier background-color, background-image, background-repeat et/ou background-position.

Cette propriété est prise en charge par les sous-classes de ` QAbstractItemView `, les sous-classes de ` QAbstractSpinBox `, ainsi que par ` QCheckBox`, ` QComboBox`, ` QDialog`, ` QFrame`, ` QGroupBox`, ` QLabel`, ` QLineEdit`, ` QMenu`, ` QMenuBar`, ` QPushButton`, ` QRadioButton`, ` QSplitter`, ` QTextEdit`, ` QToolTip` et les éléments ` QWidget` simples.

Exemple :

QTextEdit { background: yellow }

Il est souvent nécessaire de définir un motif de remplissage similaire aux styles présentés sur Qt::BrushStyle. Vous pouvez utiliser la propriété background-color pour Qt::SolidPattern, Qt::RadialGradientPattern, Qt::LinearGradientPattern et Qt::ConicalGradientPattern. Les autres motifs s’obtiennent facilement en créant une image d’arrière-plan contenant le motif souhaité.

Exemple :

QLabel {
    background-image: url(dense6pattern.png);
    background-repeat: repeat-xy;
}

Voir également background-origin, selection-background-color, background-clip, background-attachment et alternate-background-color.

background-color

Couleur d'arrière-plan utilisée pour le widget.

Exemples :

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

image d'arrière-plan

L’image d’arrière-plan utilisée pour le widget. Les parties semi-transparentes de l’image laissent transparaître l’ background-color.

Exemple :

QFrame { background-image: url(:/images/hydro.png) }

background-repeat

Indique si l'image d'arrière-plan est répétée pour remplir le rectangle d'background-origin, et de quelle manière.

Si cette propriété n'est pas spécifiée, l'image d'arrière-plan est répétée dans les deux sens (repeat).

Exemple :

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

background-position

L'alignement de l'image d'arrière-plan au sein du rectangle d'background-origin.

Si cette propriété n'est pas spécifiée, l'alignement est « top » left.

Exemple :

QFrame {
    background: url(:/images/footer.png);
    background-position: bottom left;
}

background-attachment

Détermine si l'image d'arrière-plan d'un élément QAbstractScrollArea défile ou reste fixe par rapport à la fenêtre d'affichage. Par défaut, l'image d'arrière-plan défile avec la fenêtre d'affichage.

Exemple :

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

Voir aussi background

background-clip

Le rectangle du widget, dans lequel l'background est dessinée.

Cette propriété spécifie le rectangle dans lequel l'background-color et l'background-image s sont découpées.

Cette propriété est prise en charge par les sous-classes d’ QAbstractItemView, les sous-classes d’ QAbstractSpinBox, ainsi que par les objets QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip et les objets QWidgetsimples.

Si cette propriété n’est pas spécifiée, la valeur par défaut est border.

Exemple :

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

Voir également background, background-origin et Le modèle de boîte.

background-origin

Le rectangle d'arrière-plan du widget, à utiliser conjointement avec les propriétés « background-position » et « background-image ».

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip et les QWidgetsimples.

Si cette propriété n’est pas spécifiée, la valeur par défaut est padding.

Exemple :

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

Voir également « background » et « Le modèle de boîte ».

border

Notation abrégée permettant de définir la bordure du widget. Équivaut à spécifier border-color, border-style et/ou border-width.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip et les QWidgets simples.

Exemple :

QLineEdit { border: 1px solid white }

border-top

Notation abrégée permettant de définir la bordure supérieure du widget. Équivaut à spécifier border-top-color, border-top-style et/ou border-top-width.

border-right

Notation abrégée permettant de définir la bordure droite du widget. Équivaut à spécifier border-right-color, border-right-style et/ou border-right-width.

border-bottom

Notation abrégée permettant de définir la bordure inférieure du widget. Équivaut à spécifier border-bottom-color, border-bottom-style et/ou border-bottom-width.

border-left

Notation abrégée permettant de définir la bordure gauche du widget. Équivaut à spécifier border-left-color, border-left-style et/ou border-left-width.

border-color

Couleur de tous les bords de la bordure. Équivaut à spécifier border-top-color, border-right-color, border-bottom-color et border-left-color.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip et les QWidgets simples.

Si cette propriété n'est pas spécifiée, sa valeur par défaut est « color » (c'est-à-dire la couleur de premier plan du widget).

Exemple :

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

Voir également border-style, border-width, border-image et Le modèle de boîte.

border-top-color

Couleur du bord supérieur de la bordure.

border-right-color

Couleur du bord droit de la bordure.

border-bottom-color

Couleur du bord inférieur de la bordure.

border-left-color

Couleur du bord gauche de la bordure.

border-image

Image utilisée pour remplir la bordure. L'image est divisée en neuf parties et étirée de manière appropriée si nécessaire. Voir Image de bordure pour plus de détails.

Cette propriété est prise en charge par les sous-classes d'QAbstractItemView, les sous-classes d'QAbstractSpinBox, ainsi que par les classes suivantes : QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Voir également border-color, border-style, border-width et Le modèle de boîte.

border-radius

Le rayon des coins de la bordure. Équivaut à spécifier border-top-left-radius, border-top-right-radius, border-bottom-right-radius et border-bottom-left-radius.

La propriété `border-radius` découpe l'arrière-plan de l'élément.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est 0.

Exemple :

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

Voir également border-width et Le modèle de boîte.

border-top-left-radius

Le rayon du coin supérieur gauche de la bordure.

border-top-right-radius

Le rayon du coin supérieur droit de la bordure.

border-bottom-right-radius

Rayon du coin inférieur droit de la bordure. Définir cette propriété sur une valeur positive permet d'obtenir un coin arrondi.

border-bottom-left-radius

Rayon du coin inférieur gauche de la bordure. Définir cette propriété sur une valeur positive permet d’obtenir un coin arrondi.

border-style

Le style de tous les bords de la bordure.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est none.

Exemple :

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

Voir également border-color, border-style, border-image et Le modèle de boîte.

style-de-la-bordure-supérieure

Style du bord supérieur de la bordure.

border-right-style

Style du bord droit de la bordure.

border-bottom-style

Style du bord inférieur de la bordure.

border-left-style

Style du bord gauche de la bordure.

border-width

La largeur de la bordure. Équivaut à définir les propriétés suivantes : border-top-width, border-right-width, border-bottom-width et border-left-width.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Exemple :

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

Voir également border-color, border-radius, border-style, border-image et Le modèle de boîte.

border-top-width

La largeur du bord supérieur de la bordure.

border-right-width

La largeur du bord droit de la bordure.

border-bottom-width

La largeur du bord inférieur de la bordure.

border-left-width

La largeur du bord gauche de la bordure.

bas

Si la position est « relative » (valeur par défaut), déplace un sous-contrôle vers le haut d'un certain décalage ; spécifier bottom: y revient alors à spécifier top: -y.

Si la position est « absolute », la propriété « bottom » spécifie le bord inférieur du sous-contrôle par rapport au bord inférieur du contrôle parent (voir également « subcontrol-origin »).

Exemple :

QSpinBox::down-button { bottom: 2px }

Voir également left, right et top.

button-layout

Disposition des boutons dans un QDialogButtonBox ou un QMessageBox. Les valeurs possibles sont 0 (WinLayout), 1 (MacLayout), 2 (KdeLayout), 3 (GnomeLayout) et 5 (AndroidLayout).

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indicateur de style « SH_DialogButtonLayout ».

Exemple :

* { button-layout: 2 }

couleur

Couleur utilisée pour afficher le texte.

Cette propriété est prise en charge par tous les widgets qui respectent l'QWidget::palette.

Si cette propriété n'est pas définie, la valeur par défaut est celle définie dans la palette du widget pour l'QWidget::foregroundRole (généralement le noir).

Exemple :

QPushButton { color: red }

Voir également « background » et « selection-color ».

dialogbuttonbox-buttons-have-icons

Indique si les boutons d'une boîte de dialogue « QDialogButtonBox » affichent des icônes

Si cette propriété est définie sur 1, les boutons d'une « QDialogButtonBox » affichent des icônes ; si elle est définie sur 0, les icônes ne s'affichent pas.

Reportez-vous à la section « Liste des icônes » pour savoir comment définir des icônes.

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

police

Notation abrégée permettant de définir la police du texte. Équivaut à spécifier font-family, font-size, font-style et/ou font-weight.

Cette propriété est prise en charge par tous les widgets qui respectent la norme QWidget::font.

Si cette propriété n’est pas définie, la valeur par défaut est l’ QWidget::font.

Exemple :

QCheckBox { font: bold italic large "Times New Roman" }

font-family

La famille de polices.

Exemple :

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

taille de police

La taille de la police. Dans cette version de Qt, seules les unités « pt » et « px » sont prises en charge.

Exemple :

QTextEdit { font-size: 12px }

style de police

Le style de police.

Exemple :

QTextEdit { font-style: italic }

font-weight

L'épaisseur de la police.

gridline-color*

La couleur des lignes de la grille dans un fichier « QTableView ».

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indication de style « SH_Table_GridLineColor ».

Exemple :

* { gridline-color: gray }

height

La hauteur d'un sous-contrôle (ou, dans certains cas, d'un widget).

Si cette propriété n'est pas spécifiée, sa valeur par défaut dépend du sous-contrôle ou du widget ainsi que du style actuel.

Exemple :

QSpinBox::down-button { height: 10px }

Voir également « width ».

icône

L'icône utilisée pour les widgets dotés d'une icône.

Le seul widget prenant actuellement en charge cette propriété est QPushButton.

Disponible depuis la version 5.15.

icon-size

La largeur et la hauteur de l'icône dans un widget.

La taille de l'icône des widgets suivants peut être définie à l'aide de cette propriété.

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

image*

L'image affichée dans le rectangle de contenu d'un sous-contrôle.

La propriété image accepte une liste d’ URLou un fichier de type « svg ». L’image effectivement affichée est déterminée à l’aide du même algorithme que celui de QIcon (c’est-à-dire que l’image n’est jamais agrandie, mais toujours réduite si nécessaire). Si une image de type « svg » est spécifiée, l’image est redimensionnée à la taille du rectangle de contenu. Le redimensionnement d’une image de type « svg » peut être effectué à l’aide des propriétés width et height (prises en charge depuis Qt 6.13).

La définition de la propriété `image` sur des sous-contrôles définit implicitement la largeur et la hauteur de ces derniers (sauf si l’image est au format SVG).

Utilisez la propriété ` image-position ` pour aligner l'image à l'intérieur du rectangle.

Cette propriété est réservée aux sous-contrôles ; elle n'est pas prise en charge pour les autres éléments.

Exemple :

// implicitly sets the size of down-button to the
// size of spindown.png
QSpinBox::down-button { image: url(:/images/spindown.png) }

position de l'image

L'alignement de la position de l'image peut être spécifié à l'aide d'une position relative ou absolue.

à gauche

Si la position est « relative » (valeur par défaut), déplace un sous-contrôle d'une certaine distance vers la droite.

Si la position est « absolute » (valeur par défaut), la propriété « left » spécifie le bord gauche du sous-contrôle par rapport au bord gauche du contrôle parent (voir également «subcontrol-origin»).

Si cette propriété n'est pas spécifiée, sa valeur par défaut est « 0 ».

Exemple :

QSpinBox::down-button { left: 2px }

Voir également « right », « top » et « bottom ».

espacement des lettres

Espacement entre les caractères d'une chaîne dans un widget.

lineedit-password-character*

Caractère du mot de passe « QLineEdit » sous forme de numéro Unicode.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indication de style « SH_LineEdit_PasswordCharacter ».

Exemple :

* { lineedit-password-character: 9679 }

lineedit-password-mask-delay*

Délai, en millisecondes, avant que le masque de mot de passe « QLineEdit » ne s'applique aux caractères visibles lors de la saisie (« lineedit-password-character »).

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’astuce de style « SH_LineEdit_PasswordMaskDelay ».

Disponible depuis Qt 5.4.

Exemple :

* { lineedit-password-mask-delay: 1000 }

marge

Les marges du widget. Cela revient à spécifier margin-top, margin-right, margin-bottom et margin-left.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est 0.

Exemple :

QLineEdit { margin: 2px }

Voir également « padding », « spacing » et « Le modèle de boîte ».

margin-top

La marge supérieure du widget.

margin-right

La marge droite du widget.

margin-bottom

La marge inférieure du widget.

margin-left

La marge gauche du widget.

max-height

Hauteur maximale du widget ou d'un sous-contrôle.

Cette propriété est prise en charge par les sous-classes d’ QAbstractItemView, d’ QAbstractSpinBox, ainsi que par les classes suivantes : QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit et QToolTip.

La valeur est relative au rectangle de contenu (rect) dans le modèle de boîte.

Exemple :

QSpinBox { max-height: 24px }

Voir aussi max-width.

max-width

Largeur maximale du widget ou d'un sous-contrôle.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit et QToolTip.

La valeur est relative au rectangle de contenu dans le modèle de boîte.

Exemple :

QComboBox { max-width: 72px }

Voir également max-height.

messagebox-text-interaction-flags*

Comportement d'interaction du texte dans une boîte de message. Les valeurs possibles sont définies sur Qt::TextInteractionFlags.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indication de style « SH_MessageBox_TextInteractionFlags ».

Exemple :

QMessageBox { messagebox-text-interaction-flags: 5 }

min-height

Hauteur minimale du widget ou d'un sous-contrôle.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit, QToolButton et QToolTip.

Si cette propriété n’est pas spécifiée, la hauteur minimale est calculée en fonction du contenu et du style du widget.

La valeur est relative au rectangle de contenu dans le modèle de boîte.

Exemple :

QComboBox { min-height: 24px }

Voir également min-width.

min-width

Largeur minimale du widget ou d'un sous-contrôle.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit, QToolButton et QToolTip.

Si cette propriété n'est pas spécifiée, la largeur minimale est calculée en fonction du contenu du widget et de son style.

La valeur est relative au rectangle de contenu dans le modèle de boîte.

Exemple :

QComboBox { min-width: 72px }

Voir également min-height.

opacity*

L'opacité d'un widget. Les valeurs possibles vont de 0 (transparent) à 255 (opaque). Pour l'instant, cette fonctionnalité n'est prise en charge que pour tooltips.

Si cette propriété n'est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l'indicateur de style « SH_ToolTipLabel_Opacity ».

Exemple :

QToolTip { opacity: 223 }

outline

Le contour tracé autour du bord de l'objet.

couleur-du-contour

La couleur du contour. Voir aussi border-color

outline-offset

Décalage du contour par rapport au bord du widget.

style-de-contour

Spécifie le motif utilisé pour dessiner le contour. Voir également border-style

rayon-du-contour

Ajoute des coins arrondis au contour.

rayon-du-contour-en-bas-à-gauche

Rayon du coin arrondi inférieur gauche du contour.

rayon-du-contour-en-bas-à-droite

Rayon du coin arrondi en bas à droite du contour.

rayon-du-coin-supérieur-gauche-du-contour

Rayon du coin supérieur gauche du contour.

rayon-du-coin-supérieur-droit-du-contour

Rayon du coin arrondi en haut à droite du contour.

rembourrage

Le remplissage du widget. Équivaut à spécifier padding-top, padding-right, padding-bottom et padding-left.

Cette propriété est prise en charge par les sous-classes de QAbstractItemView, les sous-classes de QAbstractSpinBox, ainsi que par QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit et QToolTip.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est 0.

Exemple :

QLineEdit { padding: 3px }

Voir également « margin », « spacing » et « Le modèle de boîte ».

padding-top

Le remplissage supérieur du widget.

padding-right

Le remplissage à droite du widget.

padding-bottom

Le remplissage inférieur du widget.

padding-left

Le remplissage à gauche du widget.

peindre-les-couleurs-des-lignes-en-alternance-pour-la-zone-vide

Indique si l'QTreeView e des couleurs de lignes alternées pour la zone vide (c'est-à-dire la zone où il n'y a aucun élément)

placeholder-text-color*

Couleur utilisée pour le texte de remplacement des widgets d'édition de texte.

Si cette propriété n'est pas définie, la valeur par défaut est celle définie pour le rôle d'PlaceholderText de la palette.

Exemple :

QLineEdit { placeholder-text-color: #800000ff } /* semi-transparent blue */

Disponible depuis la version 6.5.

position

Si les décalages spécifiés à l'aide des coordonnées « left », « right », « top » et « bottom » sont des coordonnées relatives ou absolues.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est « relative ».

à droite

Si la position est « relative » (par défaut), déplace un sous-contrôle d'un certain décalage vers la gauche ; spécifier right: x revient alors à spécifier left: -x.

Si la position est « absolute », la propriété « right » définit le bord droit du sous-contrôle par rapport au bord droit du contrôle parent (voir également « subcontrol-origin »).

Exemple :

QSpinBox::down-button { right: 2px }

Voir également left, top et bottom.

selection-background-color*

Arrière-plan du texte ou des éléments sélectionnés.

Cette propriété est prise en charge par tous les widgets qui respectent l'interface « QWidget::palette » et qui affichent du texte sélectionné.

Si cette propriété n'est pas définie, la valeur par défaut est celle définie pour le rôle « Highlight » de la palette.

Exemple :

QTextEdit { selection-background-color: darkblue }

Voir également selection-color et background.

selection-color*

Couleur de premier plan du texte ou des éléments sélectionnés.

Cette propriété est prise en charge par tous les widgets qui respectent l'QWidget::palette et qui affichent du texte de sélection.

Si cette propriété n'est pas définie, la valeur par défaut correspond à celle définie pour le rôle « HighlightedText » de la palette.

Exemple :

QTextEdit { selection-color: white }

Voir également selection-background-color et color.

show-decoration-selected*

Détermine si les sélections dans une zone de texte « QListView » couvrent toute la ligne ou uniquement l’étendue du texte.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indication de style « SH_ItemView_ShowDecorationSelected ».

Exemple :

* { show-decoration-selected: 1 }

spacing*

Espacement interne dans le widget.

Cette propriété est prise en charge par QCheckBox, QGroupBoxes, QMenuBar et QRadioButton.

Si cette propriété n'est pas spécifiée, la valeur par défaut dépend du widget et du style actuel.

Exemple :

QMenuBar { spacing: 10 }

Voir également padding et margin.

subcontrol-origin*

Le rectangle d'origine du sous-contrôle au sein de l'élément parent.

Si cette propriété n’est pas spécifiée, la valeur par défaut est padding.

Exemple :

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

Voir également subcontrol-position.

subcontrol-position*

L'alignement du sous-contrôle à l'intérieur du rectangle d'origine spécifié par subcontrol-origin.

Si cette propriété n'est pas spécifiée, sa valeur par défaut dépend du sous-contrôle.

Exemple :

QSpinBox::down-button {
    image: url(:/images/spindown.png);
    subcontrol-origin: padding;
    subcontrol-position: right bottom;
}

Voir également subcontrol-origin.

titlebar-show-tooltips-on-buttons

Indique si les infobulles s'affichent sur les boutons de la barre de titre de la fenêtre.

widget-animation-duration*

Durée de l'animation (en millisecondes). Une valeur égale à zéro signifie que les animations seront désactivées.

Si cette propriété n’est pas spécifiée, sa valeur par défaut est celle définie par le style actuel pour l’indicateur de style « SH_Widget_Animation_Duration ».

Disponible depuis Qt 5.10.

Exemple :

* { widget-animation-duration: 100 }

text-align

L'alignement du texte et de l'icône dans le contenu du widget.

Si cette valeur n'est pas spécifiée, la valeur par défaut dépend du style natif.

Exemple :

QPushButton {
    text-align: left;
}

Cette propriété n'est actuellement prise en charge que par QPushButton et QProgressBar.

text-decoration

Effets de texte supplémentaires.

haut de page

Si la position est « relative » (valeur par défaut), déplace un sous-contrôle vers le bas d'un certain décalage.

Si la position est « absolute », la propriété « top » spécifie le bord supérieur du sous-contrôle par rapport au bord supérieur du contrôle parent (voir également « subcontrol-origin »).

Si cette propriété n’est pas spécifiée, sa valeur par défaut est « 0 ».

Exemple :

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

Voir également « left », « right » et « bottom ».

largeur

La largeur d’un sous-contrôle (ou d’un widget dans certains cas).

Si cette propriété n'est pas spécifiée, sa valeur par défaut dépend du sous-contrôle/widget et du style actuel.

Exemple :

QSpinBox::up-button { width: 12px }

Voir aussi « height ».

espacement des mots

Espacement entre chaque mot d'une chaîne de caractères dans un widget.

-qt-background-role

background-color s du sous-contrôle ou du widget en fonction du rôle choisi.

-qt-style-features

Liste des propriétés CSS auxquelles vous souhaitez appliquer des styles spécifiques à Qt.

Liste des icônes

Les icônes utilisées dans Qt peuvent être personnalisées à l'aide des propriétés suivantes. Chacune des propriétés répertoriées dans cette section est de type Icon.

Notez que pour que les icônes apparaissent sur les boutons d'une boîte de dialogue de type « QDialogButtonBox », vous devez définir la propriété «dialogbuttonbox-buttons-have-icons» sur «true». De plus, pour personnaliser la taille des icônes, utilisez la propriété «icon-size».

Liste des types de propriétés

Le tableau suivant résume la syntaxe et la signification des différents types de propriétés.

QTextEdit { background-position: bottom center }

QDialog { etch-disabled-text: 1 }

/* red red red red */
QLabel { border-color: red }
/* red blue red blue */
QLabel { border-color: red blue }
/* red blue green blue */
QLabel { border-color: red blue green }
/* red blue green yellow */
QLabel { border-color: red blue green yellow }

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

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

/* linear gradient from white to green */
QTextEdit {
    background: qlineargradient(x1:0, y1:0, x2:1, y2:1,
                stop:0 white, stop: 0.4 gray, stop:1 green)
}

/* linear gradient from white to green */
QTextEdit {
    background: qlineargradient(x1:0, y1:0, x2:1, y2:1,
                stop:0 white, stop: 0.4 rgba(10, 20, 30, 40),
                stop:1 rgb(0, 200, 230, 200))
}

/* conical gradient from white to green */
QTextEdit {
    background: qconicalgradient(cx:0.5, cy:0.5, angle:30,
                stop:0 white, stop:1 #00FF00)
}

/* radial gradient from white to green */
QTextEdit {
    background: qradialgradient(cx:0, cy:0, radius: 1,
                fx:0.5, fy:0.5, stop:0 white, stop:1 green)
}

* {
    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); }

Liste des pseudo-états

Les pseudo-états suivants sont pris en charge :

Liste des sous-contrôles

Les sous-contrôles suivants sont disponibles :

Consultez la section Personnalisation du sous-contrôle « Indicateur de menu » du QPushButton pour découvrir un exemple de personnalisation d’un sous-contrôle.