## 9.3 樣式表概述 樣式表的出現并不是要取代子類化 QStyle 類的方法。事實上，樣式表在 Qt 的風格之上 起作用（如果使用了樣式表，QWidget::style()返回的 QStyle 為”style sheet”），提供 了比 QPalette（用來設置窗口部件的顏色組合）更為靈活、強大的機制。 ### 9.3.1 基本語法 樣式表的語法和 HTML CSS 基本是一致的。Qt 的樣式表對大小寫不敏感，但對類名、對 象名和屬性名大小寫敏感。如下示例設置了所有 QTextEdit 對象背景是黃色的，所有 QPushBox 對象文本為綠色： ``` QTextEdit {background:yellow} QPushBox {color:green} ``` 1\.樣式規則 樣式表包含一系列的規則，一個樣式規則由選擇符和定義組成。選擇符（ selector）確 定有哪些窗口部件受規則影響，定義說明了在窗口部件上應用哪些屬性。 例如： ``` QRadioButton {color:red} ``` 在這條規則里，QRadioButton 是選擇符，{color:red}是定義。這條規則說明了 QRadioButton 和它的子類應該使用紅色作為前景色。 幾個選擇符可以使用一個定義，使用逗號分隔選擇符。如： ``` QPushButton,QCheckEdit,QComboBox {color:red} ``` 定義由一個或多個屬性和值對組成，中間用分號隔開，如： ``` QPushButton { color:red;background-color:white } ``` 2\.選擇符類型 Qt 支持所有 CSS2 中所有的選擇符，表 9-1 給出了常用的選擇符。 表 9-1 常用的選擇符 | 選擇符 | 示例 | 可以匹配的窗口部件 | | --- | --- | --- | | 通配 | * | 所有窗口部件 | | 類型 | QLabel | 給定類的實例，包括其子類 | | 屬性 | QComboBox[editable=”true”] | 所有可以編輯的給定類的實例 | | 類 | .QCheckBox | 給定類的實例，而不包括其子類 | | 標識 | QRadioButton#red | 對象名為 red 的給定類的對象 | | 子孫對象 | QWidget QToolButton | 所有是 QWidget 的子孫對象的 QToolButton 對象 | | 子對象 | QWidget>QGroupBox | 所有是 QWidget 的直接子對象的 QGroupBox 對象 | 3\.子控件 對于復雜控件，可以訪問它的子控件。如 QCheckBox 上的下拉按鈕，QSpinBox 上的向上 和向下箭頭。如： ``` QComboBox::drop-down { image:url (myarrow.png) } ``` 上面的代碼使用了自定義的下拉按鈕圖像。 ::是 CSS3 中的偽元素。 4\.偽狀態 選擇符可以包含偽狀態來表示窗口部件的狀態。偽狀態在選擇符之后，以冒號分隔 ，下面定義了當鼠標在 QPushButton 上懸停時的規則： ``` QPushButton : hover {color : white } ``` 5\.沖突解決 當不同的規則應用到相同的屬性時，樣式表就產生了沖突。在這種情況下，特定的規則 比通用的規則優先；偽狀態比沒有偽狀態的優先；如果級別相同，則最后一個規則優先。沖 突解決按照 CSS2 規范進行。 6\.層疊 樣式表可以在 Qapplication 這個級別設置，也可以在父窗口部件，子窗口部件級別設 置。實際應用樣式時，則合并者幾個級別的樣式。當有沖突時，窗口部件自身的樣式優先使 用，接下來是父窗口部件，祖先窗口部件，依次類推。 7\.盒子模型 窗口部件盒子窗口部件支持背景（background）、邊框（border）、邊距（margin）、填襯（padding），圖 9-10 顯示了樣式表的盒子模型。  圖 9-10 Qt 樣式表的盒子模型 這個模型可以指定 4 個影響布局的矩形，從而繪制一個自定義的窗口部件： (1) contents 矩形位于最里面。它是繪制窗口部件內容（如文字或圖片）的地方。 (2) padding 矩形包圍 contents 矩形。它負責由 padding 屬性指定填充操作。 (3) border 矩形包圍 padding 矩形。它為邊界預留空間。 (4) margin 矩形在最外邊，它包圍 border 矩形，負責任何指定的邊緣空白區域。 對于沒有 padding、border 和 margin 的普通窗口部件，這 4 個矩形重合在一起。