什么是盒子模型
使用样式表时，每个小部件都被视为具有四个同心矩形的框：外边框矩形，边框矩形，填充矩形和内容矩形。
盒子模型更详细地描述了这一点。 在默认情况下，所有四个矩形（margin，border，padding 和content）值都为0，恰好重合。
想象一个盒子，它有四个属性：
- 外边距（margin）
- 边框（border）
- 内边距（padding）
- 内容（content）
让我们俯视这个盒子，它有上下左右四条边，这四部分可同时设置，也可分别设置；内边距可以理解为盒子里装的东西和边框的距离，而边框有厚薄和颜色之分，内容就是盒子中间装的东西，外边距就是边框外面自动留出的一段空白。
盒子模型能干什么?（定制）
内容（CONTENT）就是盒子里装的东西；
填充(PADDING)就是怕盒子里装的东西（贵重的）损坏而添加的泡沫或者其它抗震的辅料；
边框(BORDER)就是盒子本身了；
边界(MARGIN)则说明盒子摆放的时候的不能全部堆在一起，要留一定空隙保持通风，同时也为了方便取出。
QT开发中，CONTENT内容常指文字、图片等元素，但是也可以是小盒子（DIV嵌套），与现实生活中盒子不同的是，现实生活中的东西一般不能大于盒子，否则盒子会被撑坏的，而CSS盒子具有弹性，里面的东西大过盒子本身最多把它撑大，但它不会损坏的。
盒子模型背景
您可以使用background-image属性为小部件指定背景。默认情况下，仅为边框内的区域绘制背景图像。这可以使用background-clip属性进行更改。您可以使用background-repeat和background-origin来控制背景图像的重复和原点。
背景图片不会随着小部件的大小而缩放。为了提供一个随着小部件尺寸一起缩放的“皮肤”或背景，必须使用边框图像border-image。由于border-image属性提供了替代背景，因此在指定border-image时不需要指定背景图像。在这种情况下，当它们都被指定时，边界图像替代背景图像。
子控件
一个组件可以看作一颗子控件树。例如QComboBox绘制下拉按钮子控件，下拉按钮子控件绘制了向下箭头子控件。
子控件享有父子关系。QComboBox中，向下箭头的父亲是下拉按钮，下拉按钮的父亲的QComboBox组件本身。子控件可以使用subcontrol-position属性和subcontrol-origin属性定位在父组件内。
一旦定位，子控件就可以使用盒子模型定制样式。
注意，像QComboBox和QScrollBar这样复杂的组件，如果有一个属性或是子控件选择器被定制，所有其他的属性或是子控件选择器也要必须被定制。
SubControl参考：
哪些控件、子控件可以设置属性？
在帮助文档中搜索：Qt Style Sheets Reference
- List of Stylable Widgets（哪些窗口可以改变样式）
- List of Properties（哪些属性可以设置）
- List of Icons（哪些widget可以设置图标）
- List of Property Types(属性都有哪些选项)
- List of Pseudo-States（都有哪些伪状态）
- List of Sub-Controls（哪些子控件可以控制）
Qt给了我们哪些样式表实例？
帮助文档中搜索：Qt Style Sheets Examples
- Style Sheet Usage（样式设置属性）
- Customizing Using Dynamic Properties（动态属性设置）
- Customizing a QPushButton Using the Box Model（利用盒子模型）
- Customizing the QPushButton‘s Menu Indicator Sub-Control（菜单标识子控件）
- Complex Selector Example（复杂选择器示例）
- Customizing Specific Widgets(定制化自己的小部件)
由于前面的样式表设置代码比较散，可以用一个文件专门存放样式表代码。
用.qss的文件存放。
如：
可能.qss的文件没有高亮，可以在工具-》选项-》环境-》MIME类型中添加
然后用这种方式来使用：
QFile *qssFile = new QFile(":/qss/my.qss", this);
// 只读方式打开该文件
qssFile->open(QFile::ReadOnly);
// 读取文件全部内容，使用tr()函数将其转换为QString类型
QString styleSheet = tr(qssFile->readAll());
// 为QApplication设置样式表
setStyleSheet(styleSheet);
qssFile->close();皮肤配置：
/****************主界面背景*******************/
QMainWindow{
/*背景图片*/
background-image: url(:/image/beijing01.png);
}
/****************按钮部件*******************/
QPushButton{
/*背景色*/
background-color: rgba(100, 225, 100, 30);
/*边框样式*/
border-style: outset;
/*边框宽度为4像素*/
border-width: 4px;
/*边框圆角半径*/
border-radius: 10px;
/*边框颜色*/
border-color: rgba(255, 225, 255, 30);
/*字体*/
font: bold 14px;
/*字体颜色*/
color:rgba(0, 0, 0, 100);
/*填衬*/
padding: 6px;
}
/*鼠标悬停在按钮上时*/
QPushButton:hover{
background-color:rgba(100,255,100, 100);
border-color: rgba(255, 225, 255, 200);
color:rgba(0, 0, 0, 200);
}
/*按钮被按下时*/
QPushButton:pressed {
background-color:rgba(100,255,100, 200);
border-color: rgba(255, 225, 255, 30);
border-style: inset;
color:rgba(0, 0, 0, 100);
}
/****************滑块部件*******************/
/*水平滑块的手柄*/
QSlider::handle:horizontal {
image: url(:/image/sliderHandle.png);
}
/*水平滑块手柄以前的部分*/
QSlider::sub-page:horizontal {
/*边框图片*/
border-image: url(:/image/slider.png);
}
