自學QT之QSS面板美化教程
借鑑css的靈感， Qt也聲援Qt自己的css, 簡稱qss。同css相仿，qss的首要效能與最目標都是能使介面的體現與介面的元素分手，即質與形的分開，就好像一一己可以在不同的時候穿上不同的衣服一樣，css機制的引入，使得設計一種面板與介面控制元件分別的軟體成為也許，利用過程也能像web介面那樣隨便地變換外表。
1,模式化方式，
QSS語法
同css一樣，他也有由一個selector與一個declaration形成，selector指定了是對哪一個控制元件發生後果，而declaration才是真實的發生作用的語句。如：
QPushButton { color: red }
QPushButton指定了是對所有的QPushButton或是其子類控制元件（如使用者定義的MyPushButton）發生波及，而color:red闡明所有的受波及控制元件的前景緻都為red。
除非“類名”，“物件名”，“Qt屬性名”這三樣東西是大小寫敏感的外其餘的東西都是大小寫不敏感的，如color與Color代表統一屬性。
萬一有幾個selector指定了相像的declaration, 能夠運用逗號（,
QPushButton, QLineEdit, QComboBox { color: red }
他相當於：
QPushButton { color: red }
QLineEdit { color: red }
QComboBox { color: red }
declaration部份是一系列的（屬性：值）對，使用分號（;）將各個不同的屬性值對分離，使用大括號（{}）將所有declaration包括在同時。
1， 平常選擇器（selector）
Qt扶持所有的CSS2定義的選擇器，其祥細內容可以在w3c的網站上查詢http://www.w3.org/TR/CSS2/selector.html ， 中間對照常用的selector類別有：
i. 通用型別選擇器：*
會對所有控制元件有結果。
ii. 類別選擇器：QPushButton
匹配所有QPushButton的例項和其子類的例項。
iii. 屬性選擇器：QPushButton[flat=”false”]
匹配所有QPushButton屬性flat為false的例項，屬性分為兩種，靜態的和動態的，靜態屬性可以穿過Q_PROPERTY() 來指定，來動態屬性可以使用setProperty來指定，如：
QLineEdit *nameEdit = new QLineEdit(this);
nameEdit->setProperty("mandatoryField", true);
如果在設定了qss後Qt屬性變動了，必要從新設定qss來使其見效，可以使用先unset再set qss。
iv. 類選擇器：.QPushButton
相稱所有QPushButton的例項，但不包括其子類，這相當於：
*[class~="QPushButton"]
~=的含義是測驗一個QStringList類別的屬性是否包羅給定的QString。
v. ID抉擇器：QPushButton#okButton
對應Qt裡面的object name設定，使用這條CSS之前要先設定對應控制元件的object name為okButton，如：
Ok->setObjectName(tr(“okButton”));
vi. 後代選擇器：QDialog QPushButton
相稱所有為QDialog後代（包括兒子，與兒子的兒子的遞迴）為QPushButton的例項
vii. 子選擇器：QDialog > QPushButton
相稱所有的QDialog直接子類QPushButton的例項，不包羅兒子的兒子的遞迴。
2， 子控制元件選擇器
i. 對於龐雜的控制元件，也許會在中間包括其餘子控制元件，如一個QComboxBox中有一個drop-down的按鈕。那麼目前如果要設定QComboxBox的下拉按鈕的話，就可以這麼走訪：
QComboBox::drop-down { image: url(dropdown.png) }
其標記是（::）
ii. 子控制元件選擇器是用位置的引用來代表一個元素，這個元素可以是一個唯一控制元件或是另一個包羅子控制元件的複合控制元件。使用subcontrol-origin屬性可以變換子控制元件的默許放置位置，如：
QComboBox {
margin-right: 20px;
}
QComboBox::drop-down {
subcontrol-origin: margin;
}
如上語句可以用來轉變drop-down的margin。
iii. 相對位子屬性可以用來變換子控制元件相對於起初位置的偏移量，如當一個QCombox的drop-down按鈕被按下時，我們可以用一個內部的小偏移量來表示被按下的結果，如下：
QComboBox::down-arrow {
image: url(down_arrow.png);
}
QComboBox::down-arrow:pressed {
position: relative;
top: 1px; left: 1px;
}
iv. 絕對位子屬性准許子控制元件轉變自己的位子和大小而不受引用元素的控制元件。一但位置被設定了，這些子控制元件就可以被當做平常的widget來看待，並且可以應用合模型。關於合模型可以參考下面。
萬一你要察看Qt扶持哪些子控制元件選擇器，可以參看：
http://pepper.troll.no/s60prereleases/doc/stylesheet-reference.html#list-of-sub-controls-syntax.html
3， 偽挑選器（pseudo-states）
i. 偽選擇器以冒號（:）表示，與css裡的偽選擇器相仿，是基於控制元件的一些大致形勢來限量過程的規定，如hover規矩表示滑鼠通過控制元件時的形勢，而press表示按下按鈕時的形勢。如：
QPushButton:hover {
Background-color:red;
}
表示滑鼠通過時QPushButton背景變紅。
ii. Pseudo還扶持否認記號（！），如：
QRadioButton:!hover { color: red }
表示不曾滑鼠移上QRadioButton時他揭示的色澤是red。
iii. Pseudo可以被串連在同時，譬如：
QPushButton:hover:!pressed { color: blue; }
表示QPushButton在滑鼠移上卻不曾點選時顯現blue字，但如果點選的時候就不會揭示blue色澤了。
iv. 同樣可以和之前所講的子控制元件挑選器同時結合應用，如：
QSpinBox::down-button:hover { image: url(btn-combobox-press.bmp) }
v. 與前面所講的一樣，偽挑選器，子控制元件選擇器等都是能夠用逗號（，）分隔表示延續相像的安設的，如：
QPushButton:hover,QSpinBox::down-button, QCheckBox:checked { color: white ;image: url(btn-combobox-press.bmp);} 表示如下
vi. 更多請參看：
http://pepper.troll.no/s60prereleases/doc/stylesheet-reference.html#list-of-pseudo-states
2， 處理矛盾
a) 運用object name
i. 在程式裡面要先設定控制元件的，如：
btnOne = new QPushButton(centralWidget);
btnOne->setObjectName(QString::fromUtf8("btnOneCh"));
ii. 這麼，我們有了一個object name為btnOneCh的QPushButton，嘗試一下，使用指定object name的方法，如：
QPushButton#btnOneCh { color: red }
QPushButton { color: white }
可以看出，btnOncCh的color變成了red
b) 運用偽抉擇器，如hover，press，enabled等,
i. 按扭“1”是disable了的，
QPushButton:!enabled {color: white}
c) 所有的型別選擇器都有一個共有的個性，即使如果有兩個屬性抵觸了的話就會以最終展現的一個為準，如：
QPushButton { color: red }
QAbstractButton { color: gray }
由於QPushButton為QAbstractButton的子類，如果只設置QAbstractButton的可以想像成果是所有的QPushButton都為gray, 如果只設置QPushButton的所有QPushButton都會為red，當兩個都能設定起效的時候，以在文字上最終展現的為準，因而結局為Grey
d) 當然中間假使有#指定了object name，他所設定的優先順序是最大的，詳細規定可以參考：http://www.w3.org/TR/CSS2/cascade.html#specificity，或是
http://pepper.troll.no/s60prereleases/doc/stylesheet-syntax.html#conflict-resolution
QPushButton#btnOneCh { color: red }
QPushButton { color: blue }
QAbstractButton { color: gray }
固然QAbstractButton在末尾，然而之前有#btnOneCh指定了QPushButton“一”的color為red因而最終顯現也是“一”為red。
3， 級聯效應
a) 子類可以傳承父類的StyleSheet，然而如果子類裡面設定了StyleSheet與父類裡在設定的有抵觸，那麼當然會優先斟酌子類自己的，同樣，如果在qApp時面設定了，然而在某一個特定控制元件裡面也設定，如果有矛盾，也是優先控制元件自己的，譬如，我在程式時面設定了：
btnOneEn->setStyleSheet("QPushButton { color: red }");
而，當我再設定qApp時，如果,typedef的四種用法和兩種陷阱，將QPushButton的color設定成grey的，那麼結局是對於btnOneEn這個QPushButton來說他的色澤還是red。
這即使為什麼此地設定為grey了btnOneEn卻還是red的。
b) 如果我們對一個控制元件設定StyleSheet為：
QPushButton* myPushButton;
myPushButton->setStyleSheet("* { color: blue }");
其實他和設定為：
myPushButton->setStyleSheet("color: blue");
結果相像，只是後一種安設不會對QPushButton的子類發生作用，但第一種卻會。
4， 傳承性
a) 與CSS不同的一點，在CSS box模型中，如果一個元素在別一元素的裡面，那麼裡面的元素會主動傳承外邊元素的屬性，但QSS裡面不會，如：
一個QPushButton萬一放在一個QGroupBox裡邊，假使：
qApp->setStyleSheet("QGroupBox { color: red; } ");
並不代表在QGroupBox裡邊的QPushButton也會有color:red的屬性，假使要想有的話要顯現寫明，如：
qApp->setStyleSheet("QGroupBox, QGroupBox * { color: red; }");
或許在利用過程裡邊也可以用QWidget::setFont等來設定到子控制元件的屬性。
5， Namespace矛盾
a) 型別選擇器可以使用到一個特定的型別，如：
class MyPushButton : public QPushButton {
// ...
}
qApp->setStyleSheet("MyPushButton { background: yellow; }");
因為QSS使用QObject::className來推斷要賦與style sheet的控制元件型別，如果一個使用者定義控制元件型別在一個namespace裡面的話，QObject::className會回來<namespace>::<classname> 的名字，這和子控制元件選擇器的語法相抵觸，為打聽決此問題,好孩子推車，使用“--”來替換“::”，譬如：
namespace ns {
class MyPushButton : public QPushButton {
// ...
}
}
qApp->setSytleSheet("ns--MyPushButton { background: yellow; }");
6， 安設對像屬性
a) 如果在程式裡面使用Q_PROPERTY設定的屬性，可以在qss裡面使用：qproperty-<property name>的模式來走訪並設定值。如：
MyLabel { qproperty-pixmap: url(pixmap.png); }
MyGroupBox { qproperty-titleColor: rgb(100, 200, 100); }
QPushButton { qproperty-iconSize: 20px 20px; }
如果屬性引用到的是一個由Q_ENUMS宣告的enum 時，要引用其屬性名字要用定義的名目而不是數字。
詳細能夠參看qt assistant中的Qt style sheet
不幸的是，隨著工夫的移動，客戶程式碼也許會轉變回來的Dimension物件的值，這個時候，追蹤差錯的起源是件無味且費時的事情，特別是在多執行緒環境中。