Qt樣式表的思想很大程度上來自於HTML的層疊式樣式表（CSS），通過呼叫QWidget::setStyleSheet()或QApplication::setStyleSheet()，可以為一個獨立的子部件、整個視窗，甚至是整個應用程式指定一個樣式表。 1.樣式表語法基礎 Qt樣式表與CSS的語法規則幾乎完全相同。 一個樣式表由一系列的樣式規則構成。每個樣式規則都有這下面的形式： selector { attribute: value}

• 選擇器(selector)部分通常是一個類名（例如QComboBox），當然也還有其他的語法形式。
• 屬性(attribute)部分是一個樣式表屬性的名字，值(value)部分時賦給給屬性的值。

為了使用方便，還可以使用一種簡化形式： selector1,selector2, ..., selectorM { attribute1: value1; attribute2: value2; ... attributeM: valueM; } 這種簡化形式可以同時為與M個選擇器相匹配的部件設定N種屬性。例如： QCheckBox, QComboBox, QSpinBox{ color: red; background-color: white; font: bold; } 這個規則設定了所有的QCheckBox、QComboBox和QSpinBox的前景色、背景色和字型。 setStyleSheet("QLabel {color:rgb(0, 255, 255);" "background-color: red"; "}"); 2.方箱模型 在樣式表中，每個部件都被看作是一個由四個同心相似的矩形組成的箱體：

• 空白（margin） 空白區域位於邊框外，並且總是透明的
• 邊框（border） 邊框為部件提供了四周的框架，其border-style屬下可以設定為一些內建的框架風格，如inset、outset、solid和ridge。
• 填充（padding） 填充在邊框和內容區域之間提供了空白間隔。
• 內容（content）

對於一個平面部件，例如空白、邊框和填充都是0畫素的部件而言，這四個矩形是完全重合的。 3.前景與背景

• 部件的前景色用於繪製上面的文字，可以通過color屬性指定。
• 背景色用於繪製部件的填充矩形，可以通過background-color屬性指定。
• 背景圖片使用background-image屬性定義，它用於繪製由background-origin指定的矩形區域（空白、邊框、填充或內容）。背景圖片在矩形區域內的對齊和平鋪方式可以通過background-position和background-repeat屬性指定。

如果指定的背景圖片具有alpha通道（即有半透明效果），通過background-color指定的顏色將會透過透明區域。這一功能可以使背景圖片在多種環境下重複利用。 該例子中使用的樣式表如下所示： QFrame{ margin:10px; boder: 2px solid green; padding: 20px; background-color: gray; background-image: url(qt.png); background-position: top right; background-repeat: none; } 在這個例子中，QFrame四周的空白、邊框和填充值都是一樣的。實際上margin屬性可以在上下左右四個方向分別指定我們需要的不通知，例如： QFrame{ margin:14px 18px 20px 18px; } 同時，也可以分別制定margin-top、margin-right、margin-botton、margin-left四個屬性。 QFrame{ margin-top:14px; margin-right:18px; margin-botton:20px; margin-left:18px; } 雖然目前僅僅使用了QFrame作為例子，但是也可以同樣的將這些屬性應用於任何一個支援方箱模型的Qt部件，例如：QCheckBox、QLabel、QLineEdit、QListView、QMenu、QPushButton、QTextEdit、和QToolTip。 4.建立可縮放樣式 在預設情況下，通過background-image指定的背景圖片會自動重複平鋪，以覆蓋部件的整個填充矩形（即邊框裡面的那個區域）。如果我們想建立能夠隨著部件大小自動縮放而不是平鋪的背景，需要設定一種稱之為“邊框圖片”的東西。 “邊框圖片”可以通過border-image屬性指定，它同時提供了部件的背景和邊框。一個“邊框圖片”被分為九個部分（九宮格），有點想tic-tac-toe遊戲的棋盤。 當一個部件的邊框被填充時，四角的格子通常不會發生變化，而其餘的五個格子則可能被拉伸或平鋪以填充可用空間。 當指定一個“邊框圖片”時，除了圖片本身，還必須指定用來分隔九宮格的四條分割線。同時還必須指定非邊角的格子是應該平鋪還是拉伸，以及邊框的寬度（用來確定邊角格子的大小，防止邊角被縮放變形）。 例如： QPushButton{ border-width: 4px; border-image: url(button.png) 4 4 4 4 stretch stretch; } 另外，“邊框圖片”還應該含有alpha通道，以使背景能夠在邊角處露出來。 5.控制大小 min-width和min-height兩個屬性可以用來指定一個部件的內容區域的最小大小。這兩個值將影響部件的minimumSizeHint()，並在佈局時被考慮。 例如： QPushButton{ min-width: 68px; min-height: 28px; } 如果該屬性沒有被指定，最小大小將從部件的內容區域和當前樣式中繼承。 6.處理偽狀態 部件的外觀可以按照使用者介面元素狀態的不同來分別定義，這在樣式表中被稱為“偽狀態”。例如，如果想在一個push button在被按下的時候具有sunken的外觀，我們可以指定一個叫做：pressed的偽狀態。 QPushButton{ border: 2px outset green; background: gay; } QPushButton: pressed{ border-style: inset; } 下面是可用的偽狀態列表： 表1：偽狀態列表 偽狀態 描述 :checked button部件被選中 :disabled 部件被禁用 :enabled 部件被啟用 :focus 部件獲得焦點 :hover 滑鼠位於部件上 :indeterminate checkbox或radiobutton被部分選中 :off 部件可以切換，且處於off狀態 :on 部件可以切換，且處於on狀態 :pressed 部件被滑鼠按下 :unchecked button部件未被選中 ui->pushButton->setStyleSheet("QPushButton{" "border-image:url(:/new/prefix1/image/Sunny.png)" "}" "QPushButton:hover{" "border-image:url(:/new/prefix1/image/up.png)" "}" "QPushButton:pressed{" "border-image:url(:/new/prefix1/image/Luffy.png)" "}" ); 7.使用子部件定義微觀樣式 許多部件都包含有子元素，這些元素可以稱為“子部件”。SpinBox的上下箭頭就是子部件最好的例子。 子部件可以通過::來指定，例如QDateTimeEdit::up-button。定義子部件的樣式與定義部件非常相似，它們遵循前面提到的方箱模型（即它們可以擁有自己的邊框、背景等），並且也可以和偽狀態聯合使用（例如:QSpinBox::up-button:hover） 下面列出可用的子部件型別： 表2子部件列表 子部件 描述 ::down-arrow combo box或spin box的下拉箭頭 ::down-button spin box的向下按鈕 ::drop-down combo box的下拉箭頭 ::indicator checkbox、radio button或可選擇group box的指示器 ::item menu、menu bar或status bar的子專案 ::menu-indicator push button的選單指示器 ::title group box的標題 ::up-arrow spin box的向上箭頭 ::up-button spin box的向上箭頭 通過指定subcontrol-position和subcontrol-origin屬性，子部件可以被放置在部件箱體內的任何位置。並且，子部件的位置還可以使用相對或絕對的方式進一步的調整。具體選擇何種調整方式取決於子部件具有固定的大小，還是會隨著父部件而變化。