Qt 스타일 시트 참조

Qt 스타일 시트는 위젯의 외관을 사용자 정의할 수 있도록 다양한 속성, 의사 상태 및 하위 컨트롤을 지원합니다.

스타일 적용 가능한 위젯 목록

다음 표에는 스타일 시트를 사용하여 사용자 정의할 수 있는 Qt Widgets가 나열되어 있습니다:

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

속성 목록

이 섹션에서는 Qt 스타일 시트에서 지원하는 모든 속성을 나열합니다. 속성에 지정할 수 있는 값은 해당 속성의 유형에 따라 다릅니다. 별도로 명시되지 않는 한, 다음 속성은 모든 위젯에 적용됩니다. 별표(*)로 표시된 속성은 Qt 전용이며, CSS2나 CSS3에는 이에 상응하는 속성이 없습니다. Qt 전용 속성은 다음과 같습니다:

• gridline-color*
• image*
• lineedit-password-character*
• lineedit-password-mask-delay*
• 메시지 상자 텍스트 상호작용 플래그*
• opacity*
• 자리 표시자 텍스트 색상*
• 선택 영역 배경색*
• 선택색*
• 선택 시 장식 표시*
• 간격*
• 하위 컨트롤 원점*
• 하위 컨트롤 위치*
• 위젯 애니메이션 지속 시간*

강조색

이 속성은 상호작용 가능한 UI 요소를 강조하는 데 사용되는 강조색( Accent)을 설정합니다. 이 속성이 설정되지 않은 경우, 기본값은 강조색( highlight )으로 지정됩니다.

대체 배경색

QAbstractItemView 의 서브클래스에서 사용되는 ` alternate background color `.

이 속성이 설정되지 않은 경우, 기본값은 팔레트의 ‘ AlternateBase ’ 역할에 설정된 값입니다.

예시:

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

‘background ’ 및 ‘selection-background-color’ 항목도 참조하십시오.

background

배경을 설정하기 위한 약식 표기법입니다. background-color, background-image, background-repeat 및/또는 background-position 을 지정하는 것과 동일합니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip 및 일반 QWidget에서 지원됩니다.

예시:

QTextEdit { background: yellow }

종종 Qt::BrushStyle 에 있는 스타일과 유사한 채우기 패턴을 설정해야 할 때가 있습니다. Qt::SolidPattern, Qt::RadialGradientPattern, Qt::LinearGradientPattern 및 Qt::ConicalGradientPattern 의 경우 background-color 속성을 사용할 수 있습니다. 그 외의 패턴은 해당 패턴이 포함된 배경 이미지를 생성함으로써 쉽게 구현할 수 있습니다.

예시:

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

관련 항목: background-origin, selection-background-color, background-clip, background-attachment 및 alternate-background-color.

background-color

위젯에 사용되는 배경색입니다.

예시:

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

background-image

위젯에 사용되는 배경 이미지입니다. 이미지의 반투명한 부분을 통해 background-color 가 비쳐 보입니다.

예시:

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

background-repeat

배경 이미지가 ‘ background-origin ’ 사각형을 채우기 위해 반복되는지 여부와 그 방식.

이 속성이 지정되지 않은 경우, 배경 이미지는 양방향(repeat)으로 반복됩니다.

예시:

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

background-position

background-origin 사각형 내 배경 이미지의 정렬 방식.

이 속성이 지정되지 않은 경우, 정렬 방식은 top left 입니다.

예시:

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

background-attachment

QAbstractScrollArea 내의 배경 이미지가 뷰포트에 따라 스크롤되는지, 아니면 고정되는지를 결정합니다. 기본적으로 배경 이미지는 뷰포트와 함께 스크롤됩니다.

예시:

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

관련 항목: background

background-clip

background 가 그려지는 위젯의 사각형 영역.

이 속성은 ` background-color ` 및 ` background-image `이 잘려 들어가는 사각형을 지정합니다.

이 속성은 QAbstractItemView 하위 클래스, QAbstractSpinBox 하위 클래스, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip 및 일반 QWidget에서 지원됩니다.

이 속성이 지정되지 않은 경우 기본값은 border 입니다.

예시:

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

관련 항목: background, background-origin 및 박스 모델.

background-origin

background-position 및 background-image 와 함께 사용되는 위젯의 배경 사각형입니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip 및 일반 QWidget에서 지원됩니다.

이 속성이 지정되지 않은 경우 기본값은 padding 입니다.

예시:

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

‘background ’ 및 ‘박스 모델’ 항목도 참조하십시오.

border

위젯의 테두리를 설정하는 약식 표기법입니다. ` border-color`, ` border-style` 및/또는 ` border-width`을 지정하는 것과 동일합니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip 및 일반 QWidget에서 지원됩니다.

예시:

QLineEdit { border: 1px solid white }

border-top

위젯의 상단 테두리를 설정하는 약식 표기법입니다. ` border-top-color`, ` border-top-style` 및/또는 ` border-top-width`을 지정하는 것과 동일합니다.

border-right

위젯의 오른쪽 테두리를 설정하는 약식 표기법입니다. border-right-color, border-right-style 및/또는 border-right-width 을 지정하는 것과 동일합니다.

border-bottom

위젯의 하단 테두리를 설정하는 약식 표기법입니다. ` border-bottom-color`, ` border-bottom-style` 및/또는 ` border-bottom-width`을 지정하는 것과 동일합니다.

border-left

위젯의 왼쪽 테두리를 설정하는 약식 표기법입니다. ` border-left-color`, ` border-left-style` 및/또는 ` border-left-width`을 지정하는 것과 동일합니다.

border-color

모든 테두리 가장자리의 색상입니다. border-top-color, border-right-color, border-bottom-color 및 border-left-color 을 지정하는 것과 동일합니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip 및 일반 QWidget에서 지원됩니다.

이 속성이 지정되지 않으면 기본값은 color (즉, 위젯의 전경색)입니다.

예시:

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

관련 항목: border-style, border-width, border-image 및 박스 모델.

border-top-color

테두리의 상단 가장자리 색상입니다.

border-right-color

테두리의 오른쪽 가장자리 색상입니다.

하단 테두리 색상

테두리의 하단 가장자리 색상입니다.

border-left-color

테두리의 왼쪽 가장자리 색상.

border-image

테두리를 채우는 데 사용되는 이미지입니다. 이 이미지는 9개의 부분으로 나뉘며, 필요한 경우 적절하게 늘어나게 됩니다. 자세한 내용은 ‘테두리 이미지’를 참조하십시오.

이 속성은 QAbstractItemView 하위 클래스, QAbstractSpinBox 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit 및 QToolTip 에서 지원됩니다.

또한 border-color, border-style, border-width 및 박스 모델(The Box Model)을 참조하십시오.

border-radius

테두리 모서리의 반지름입니다. ` border-top-left-radius`, ` border-top-right-radius`, ` border-bottom-right-radius`, ` border-bottom-left-radius`을 지정하는 것과 동일합니다.

border-radius는 요소의 배경을 잘라냅니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit 및 QToolTip 에서 지원됩니다.

이 속성이 지정되지 않은 경우 기본값은 0입니다.

예시:

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

‘border-width ’ 및 ‘박스 모델’ 항목도 참조하십시오.

border-top-left-radius

테두리의 왼쪽 상단 모서리의 반경입니다.

border-top-right-radius

테두리의 오른쪽 상단 모서리의 반지름입니다.

border-bottom-right-radius

테두리의 오른쪽 아래 모서리의 반경입니다. 이 속성을 양수 값으로 설정하면 모서리가 둥글게 처리됩니다.

border-bottom-left-radius

테두리의 왼쪽 아래 모서리의 반경입니다. 이 속성을 양수 값으로 설정하면 모서리가 둥글게 처리됩니다.

border-style

테두리의 모든 가장자리에 적용되는 스타일입니다.

이 속성은 QAbstractItemView 하위 클래스, QAbstractSpinBox 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit 및 QToolTip 에서 지원됩니다.

이 속성이 지정되지 않은 경우, 기본값은 none 입니다.

예시:

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

관련 항목: border-color, border-style, border-image 및 박스 모델.

border-top-style

테두리의 상단 가장자리 스타일입니다.

border-right-style

테두리의 오른쪽 가장자리 스타일입니다.

border-bottom-style

테두리의 하단 가장자리의 스타일입니다.

border-left-style

테두리의 왼쪽 가장자리 스타일입니다.

border-width

테두리의 너비입니다. border-top-width, border-right-width, border-bottom-width 및 border-left-width 을 설정하는 것과 동일합니다.

이 속성은 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 및 박스 모델(The Box Model)을 참조하십시오.

border-top-width

테두리의 상단 가장자리 너비.

border-right-width

테두리의 오른쪽 가장자리 너비입니다.

하단 테두리 너비

테두리의 하단 가장자리 너비.

border-left-width

테두리의 왼쪽 가장자리 너비입니다.

하단

position이 relative (기본값)인 경우, 하위 컨트롤을 특정 오프셋만큼 위쪽으로 이동합니다. bottom: y 는 다음을 지정하는 것과 동일합니다. top: -y를 지정하는 것과 동일합니다.

position이 absolute 인 경우, bottom 속성은 부모 컨트롤의 하단 가장자리를 기준으로 한 하위 컨트롤의 하단 가장자리를 지정합니다( subcontrol-origin도 참조하십시오).

예:

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

left, right, top 항목도 참조하십시오.

button-layout

QDialogButtonBox 또는 QMessageBox 내 버튼의 레이아웃입니다. 가능한 값은 0 (WinLayout), 1 (MacLayout), 2 (KdeLayout), 3 (GnomeLayout) 및 5 (AndroidLayout)입니다.

이 속성이 지정되지 않은 경우, 기본값은 현재 스타일에서 ‘ SH_DialogButtonLayout ’ 스타일 힌트에 지정된 값으로 설정됩니다.

예:

* { button-layout: 2 }

color

텍스트를 표시하는 데 사용되는 색상입니다.

이 속성은 ` QWidget::palette`를 준수하는 모든 위젯에서 지원됩니다.

이 속성이 설정되지 않은 경우, 위젯의 팔레트에서 ‘ QWidget::foregroundRole ’에 대해 설정된 값(일반적으로 검은색)이 기본값으로 사용됩니다.

예시:

QPushButton { color: red }

‘background ’ 및 ‘selection-color’ 항목도 참조하십시오.

dialogbuttonbox-buttons-have-icons

QDialogButtonBox 의 버튼에 아이콘을 표시할지 여부

이 속성이 1로 설정되면 QDialogButtonBox 의 버튼에 아이콘이 표시되며, 0으로 설정되면 아이콘이 표시되지 않습니다.

아이콘 설정 방법에 대한 자세한 내용은 ‘아이콘 목록’ 섹션을 참조하십시오.

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

font

텍스트의 글꼴을 설정하기 위한 약식 표기법입니다. font-family, font-size, font-style 및/또는 font-weight 을 지정하는 것과 동일합니다.

이 속성은 QWidget::font 을 준수하는 모든 위젯에서 지원됩니다.

이 속성이 설정되지 않은 경우, 기본값은 QWidget::font 입니다.

예시:

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

font-family

글꼴 패밀리.

예시:

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

글꼴 크기

글꼴 크기. 이 버전의 Qt에서는 pt 및 px 단위만 지원됩니다.

예시:

QTextEdit { font-size: 12px }

글꼴 스타일

글꼴 스타일.

예시:

QTextEdit { font-style: italic }

글꼴 두께

글꼴의 굵기.

gridline-color*

QTableView 의 격자선 색상.

이 속성이 지정되지 않은 경우, 기본값은 SH_Table_GridLineColor 스타일 힌트에 대한 현재 스타일에서 지정된 값으로 설정됩니다.

예시:

* { gridline-color: gray }

height

서브컨트롤(또는 경우에 따라 위젯)의 높이.

이 속성이 지정되지 않은 경우, 서브컨트롤/위젯 및 현재 스타일에 따라 결정되는 값이 기본값으로 적용됩니다.

예시:

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

‘width’ 항목도 참조하십시오.

아이콘

아이콘이 있는 위젯에 사용되는 아이콘입니다.

현재 이 속성을 지원하는 위젯은 QPushButton 뿐입니다.

5.15 버전부터 사용할 수 있습니다.

icon-size

위젯 내 아이콘의 너비와 높이.

이 속성을 사용하여 다음 위젯의 아이콘 크기를 설정할 수 있습니다.

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

image*

서브 컨트롤의 콘텐츠 사각형 내에 그려지는 이미지입니다.

image 속성은 URL목록이나 svg 형식을 지원합니다. 실제로 그려지는 이미지는 QIcon 와 동일한 알고리즘을 사용하여 결정됩니다(즉, 이미지는 절대 확대되지 않으며, 필요한 경우 항상 축소됩니다). svg 가 지정된 경우, 이미지는 콘텐츠 사각형의 크기로 조정됩니다. svg 의 크기는 width 및 height 속성을 사용하여 설정할 수 있습니다(Qt 6.13부터 지원됨).

하위 컨트롤에 image 속성을 설정하면 하위 컨트롤의 width와 height가 암시적으로 설정됩니다(SVG 이미지의 경우는 제외).

image-position을 사용하여 사각형 내에서 이미지의 위치를 조정할 수 있습니다.

이 속성은 하위 컨트롤에만 적용되며, 다른 요소에서는 지원되지 않습니다.

예시:

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

image-position

이미지의 위치 정렬은 상대 위치 또는 절대 위치를 사용하여 지정할 수 있습니다.

왼쪽

position이 ' relative '(기본값)인 경우, 하위 컨트롤을 특정 오프셋만큼 오른쪽으로 이동합니다.

position이 absolute 인 경우, left 속성은 부모 컨트롤의 왼쪽 가장자리를 기준으로 한 하위 컨트롤의 왼쪽 가장자리를 지정합니다( subcontrol-origin도 참조하십시오).

이 속성이 지정되지 않은 경우, 기본값은 ` 0`입니다.

예:

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

‘right’, ‘top’, ‘bottom’ 항목도 참조하십시오.

letter-spacing

위젯 내 문자열의 문자 간 간격.

lineedit-password-character*

QLineEdit 의 비밀번호 문자를 나타내는 유니코드 번호.

이 속성이 지정되지 않은 경우, 기본값은 현재 스타일에서 ‘ SH_LineEdit_PasswordCharacter ’ 스타일 힌트에 지정된 값으로 설정됩니다.

예:

* { lineedit-password-character: 9679 }

lineedit-password-mask-delay*

QLineEdit 의 비밀번호 마스크가 적용된 후, lineedit-password-character가 표시된 문자에 적용되기까지의 지연 시간(밀리초 단위).

이 속성이 지정되지 않은 경우, ` SH_LineEdit_PasswordMaskDelay ` 스타일 힌트에 대해 현재 스타일이 지정한 값이 기본값으로 사용됩니다.

Qt 5.4부터 사용할 수 있습니다.

예시:

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

여백

위젯의 여백입니다. margin-top, margin-right, margin-bottom, margin-left 을 지정하는 것과 동일합니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit 및 QToolTip 에서 지원됩니다.

이 속성이 지정되지 않은 경우 기본값은 0 입니다.

예시:

QLineEdit { margin: 2px }

padding, spacing 및 박스 모델(The Box Model) 항목도 참조하십시오.

margin-top

위젯의 상단 여백.

오른쪽 여백

위젯의 오른쪽 여백.

margin-bottom

위젯의 하단 여백.

margin-left

위젯의 왼쪽 여백.

최대 높이

위젯 또는 하위 컨트롤의 최대 높이.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit 및 QToolTip 에서 지원됩니다.

이 값은 박스 모델의 콘텐츠 레크트에 상대적입니다.

예시:

QSpinBox { max-height: 24px }

'max-width' 항목도 참조하십시오.

max-width

위젯 또는 하위 컨트롤의 최대 너비.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit 및 QToolTip 에서 지원됩니다.

이 값은 박스 모델의 콘텐츠 사각형(contents rect)을 기준으로 합니다.

예시:

QComboBox { max-width: 72px }

'max-height' 항목도 참조하십시오.

messagebox-text-interaction-flags*

메시지 상자 내 텍스트에 대한 상호작용 동작입니다. 가능한 값은 Qt::TextInteractionFlags 를 따릅니다.

이 속성이 지정되지 않은 경우, 기본값은 현재 스타일에서 ‘ SH_MessageBox_TextInteractionFlags ’ 스타일 힌트에 지정된 값으로 설정됩니다.

예시:

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

min-height

위젯 또는 하위 컨트롤의 최소 높이.

이 속성은 ` QAbstractItemView `의 하위 클래스, ` QAbstractSpinBox `의 하위 클래스, ` QCheckBox`, ` QComboBox`, ` QFrame`, ` QGroupBox`, ` QLabel`, ` QLineEdit`, ` QMenu`, ` QMenuBar`, ` QPushButton`, ` QRadioButton`, ` QSizeGrip`, ` QSpinBox`, ` QSplitter`, ` QStatusBar`, ` QTextEdit`, ` QToolButton` 및 ` QToolTip`에서 지원됩니다.

이 속성이 지정되지 않은 경우, 최소 높이는 위젯의 내용과 스타일을 기준으로 산정됩니다.

이 값은 박스 모델 내의 콘텐츠 직사각형(rect)을 기준으로 합니다.

예시:

QComboBox { min-height: 24px }

‘min-width’ 항목도 참조하십시오.

min-width

위젯 또는 하위 컨트롤의 최소 너비.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSizeGrip, QSpinBox, QSplitter, QStatusBar, QTextEdit, QToolButton 및 QToolTip 에서 지원됩니다.

이 속성이 지정되지 않은 경우, 최소 너비는 위젯의 내용과 스타일을 기반으로 산정됩니다.

이 값은 박스 모델의 콘텐츠 직사각형(contents rect)을 기준으로 합니다.

예시:

QComboBox { min-width: 72px }

‘min-height’ 항목도 참조하십시오.

opacity*

위젯의 불투명도입니다. 가능한 값은 0(투명)부터 255(불투명)까지입니다. 현재 이 기능은 tooltips 에서만 지원됩니다.

이 속성이 지정되지 않은 경우, 기본값은 현재 스타일에서 ‘ SH_ToolTipLabel_Opacity ’ 스타일 힌트에 지정된 값으로 설정됩니다.

예시:

QToolTip { opacity: 223 }

outline

객체의 테두리 주위에 그려진 윤곽선.

outline-color

윤곽선의 색상. border-color 항목도 참조하십시오.

outline-offset

위젯의 테두리로부터 아웃라인이 떨어져 있는 거리입니다.

outline-style

윤곽선을 그릴 때 사용되는 패턴을 지정합니다. border-style 항목도 참조하십시오.

outline-radius

윤곽선에 둥근 모서리를 적용합니다.

outline-bottom-left-radius

윤곽선의 왼쪽 하단 둥근 모서리에 적용되는 반경입니다.

outline-bottom-right-radius

윤곽선의 오른쪽 하단 둥근 모서리에 적용되는 반경입니다.

outline-top-left-radius

윤곽선의 왼쪽 상단 모서리에 적용되는 반경입니다.

outline-top-right-radius

윤곽선의 우측 상단 둥근 모서리에 적용되는 반경입니다.

패딩

위젯의 패딩입니다. padding-top, padding-right, padding-bottom 및 padding-left 를 지정하는 것과 동일합니다.

이 속성은 QAbstractItemView 의 하위 클래스, QAbstractSpinBox 의 하위 클래스, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit 및 QToolTip 에서 지원됩니다.

이 속성이 지정되지 않은 경우 기본값은 0 입니다.

예시:

QLineEdit { padding: 3px }

관련 항목: margin, spacing 및 박스 모델.

padding-top

위젯의 상단 패딩.

padding-right

위젯의 오른쪽 패딩.

하단 여백

위젯의 하단 패딩.

padding-left

위젯의 왼쪽 패딩.

빈 영역에 대해 행 색상을 번갈아 칠하기

QTreeView 가 빈 영역(즉, 항목이 없는 영역)에 대해 행 색상을 번갈아 칠할지 여부

placeholder-text-color*

텍스트 편집 위젯의 자리 표시자 텍스트에 사용되는 색상입니다.

이 속성이 설정되지 않은 경우, 기본값은 팔레트의 ' PlaceholderText ' 역할에 설정된 값입니다.

예시:

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

6.5 버전부터 사용할 수 있습니다.

위치

left, right, top, bottom을 사용하여 지정된 오프셋이 상대 좌표인지 절대 좌표인지 여부.

이 속성이 지정되지 않은 경우, 기본값은 ` relative`입니다.

right

position이 relative (기본값)인 경우, 하위 컨트롤을 특정 오프셋만큼 왼쪽으로 이동합니다. right: x 는 다음을 지정하는 것과 동일합니다 left: -x를 지정하는 것과 동일합니다.

position이 absolute 인 경우, right 속성은 부모 컨트롤의 오른쪽 가장자리를 기준으로 하위 컨트롤의 오른쪽 가장자리를 지정합니다( subcontrol-origin도 참조하십시오).

예:

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

left, top, bottom 항목도 참조하십시오.

selection-background-color*

선택된 텍스트나 항목의 배경색입니다.

이 속성은 ` QWidget::palette `를 준수하고 선택 텍스트를 표시하는 모든 위젯에서 지원됩니다.

이 속성이 설정되지 않은 경우, 기본값은 팔레트의 ‘ Highlight ’ 역할에 설정된 값입니다.

예시:

QTextEdit { selection-background-color: darkblue }

‘selection-color ’ 및 ‘background’ 항목도 참조하십시오.

selection-color*

선택된 텍스트 또는 항목의 전경색입니다.

이 속성은 QWidget::palette 를 준수하고 선택 텍스트를 표시하는 모든 위젯에서 지원됩니다.

이 속성이 설정되지 않은 경우, 기본값은 팔레트의 ‘ HighlightedText ’ 역할에 설정된 값입니다.

예시:

QTextEdit { selection-color: white }

‘selection-background-color ’ 및 ‘color’ 항목도 참조하십시오.

show-decoration-selected*

QListView 의 선택 영역이 전체 행을 덮을지, 아니면 텍스트의 범위만 덮을지를 제어합니다.

이 속성이 지정되지 않은 경우, 기본값은 현재 스타일에 정의된 ‘ SH_ItemView_ShowDecorationSelected ’ 스타일 힌트의 값으로 설정됩니다.

예:

* { show-decoration-selected: 1 }

spacing*

위젯 내부의 간격.

이 속성은 QCheckBox, checkable QGroupBoxes, QMenuBar 및 QRadioButton 에서 지원됩니다.

이 속성이 지정되지 않은 경우, 기본값은 위젯과 현재 스타일에 따라 달라집니다.

예시:

QMenuBar { spacing: 10 }

'padding ' 및 'margin' 항목도 참조하십시오.

subcontrol-origin*

부모 요소 내의 하위 컨트롤의 원점 사각형.

이 속성이 지정되지 않은 경우, 기본값은 padding 입니다.

예시:

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

‘subcontrol-position’ 항목도 참조하십시오.

subcontrol-position*

subcontrol-origin으로 지정된 원점 사각형 내에서 하위 컨트롤의 정렬 방식.

이 속성이 지정되지 않은 경우, 하위 컨트롤에 따라 결정되는 값이 기본값으로 적용됩니다.

예:

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

‘subcontrol-origin’ 항목도 참조하십시오.

titlebar-show-tooltips-on-buttons

창 제목 표시줄의 버튼에 툴팁을 표시할지 여부.

widget-animation-duration*

애니메이션이 지속되어야 하는 시간(밀리초 단위). 값이 0이면 애니메이션이 비활성화됩니다.

이 속성이 지정되지 않은 경우, ` SH_Widget_Animation_Duration ` 스타일 힌트에 대해 현재 스타일이 지정한 값이 기본값으로 사용됩니다.

Qt 5.10부터 사용할 수 있습니다.

예시:

* { widget-animation-duration: 100 }

text-align

위젯 콘텐츠 내의 텍스트와 아이콘 정렬 방식.

이 값이 지정되지 않은 경우, 기본적으로 네이티브 스타일에 따른 값이 적용됩니다.

예시:

QPushButton {
    text-align: left;
}

이 속성은 현재 QPushButton 및 QProgressBar 에서만 지원됩니다.

text-decoration

추가 텍스트 효과.

맨 위

position이 ' relative '(기본값)인 경우, 하위 컨트롤을 지정된 오프셋만큼 아래로 이동합니다.

position이 absolute 인 경우, top 속성은 부모 컨트롤의 상단 가장자리를 기준으로 한 자식 컨트롤의 상단 가장자리를 지정합니다( subcontrol-origin 참조).

이 속성이 지정되지 않은 경우, 기본값은 ` 0`입니다.

예:

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

‘left’, ‘right’, ‘bottom’ 항목도 참조하십시오.

width

하위 컨트롤(또는 경우에 따라 위젯)의 너비.

이 속성이 지정되지 않은 경우, 하위 컨트롤/위젯 및 현재 스타일에 따라 결정되는 값이 기본값으로 적용됩니다.

예시:

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

'height' 항목도 참조하십시오.

word-spacing

위젯 내 문자열에서 각 단어 사이의 간격.

-qt-background-role

선택된 역할에 기반한 하위 컨트롤 또는 위젯의 ` background-color `.

-qt-style-features

Qt 전용 스타일을 적용할 CSS 속성 목록입니다.

아이콘 목록

Qt에서 사용되는 아이콘은 다음 속성을 사용하여 사용자 정의할 수 있습니다. 이 섹션에 나열된 각 속성의 유형은 Icon입니다.

QDialogButtonBox 의 버튼에 아이콘이 표시되려면 dialogbuttonbox-buttons-have-icons 속성을 true로 설정해야 합니다. 또한, 아이콘의 크기를 사용자 정의하려면 icon-size 속성을 사용하십시오.

속성 유형 목록

다음 표는 다양한 속성 유형의 구문과 의미를 요약한 것입니다.

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

의미 상태 목록

다음과 같은 의사 상태가 지원됩니다:

하위 컨트롤 목록

다음과 같은 하위 컨트롤을 사용할 수 있습니다:

서브컨트롤을 사용자 정의하는 방법에 대한 예제는 “QPushButton의 메뉴 표시기 서브컨트롤 사용자 정의”를 참조하십시오.