关于Qt中的qss样式表需要注意的坑

关于QSS要注意的坑。

- qss源自css，相当于css的一个子集，主要支持的是css2标准，很多网上的css3的标准的写法在qss这里是不生效的，所以不要大惊小怪。

- qss也不是完全支持所有的css2，比如text-align官方文档就有说明，只支持 QPushButton and QProgressBar，务必看清楚。

- 有时候偷懒直接来一句 *{xxx}，你会发现大部分是应用了，也有小部分或者极个别没有应用，你可能需要在对应的窗体中 this->setStyleSheet() 来设置。

- qss的执行是有优先级的，如果没有指定父对象，则对所有的应用，比如在窗体widget中 {color:#ff0000} 这样会对widget以及widget的所有子对象应用该样式，这种问题各大群每周核简都有人问，你会发现各种奇奇怪怪的异样不正常，怎么办呢，你需要指定类名或者对象名，比如 #widget{color:#ff0000} 这样就只会对widget对象应用该样式，另一种写法 QWidget#widget{color:#ff0000}，只想对窗体本身而不是子控件按钮标签等 .QWidget{color:#ff0000} ，具体详细规则参见官方说明。

- qss整体来说还是可以的，解析速度性能在Qt5高版本后期比Qt4好很多，尤其是修复了不少qss中的解析绘制BUG。尽管有这样那样的BUG，怀着包容的心对待它。

- qss官方学习地址1：[http://47.100.39.100/qtwidgets/stylesheet-reference.html](http://47.100.39.100/qtwidgets/stylesheet-reference.html)

- qss官方学习地址2：[http://47.100.39.100/qtwidgets/stylesheet-examples.html](http://47.100.39.100/qtwidgets/stylesheet-examples.html)

Qt样式表有多种运行机制，主要是考虑到各种需求场景，继承自QWidget的类和qApp类都支持setStyleSheet方法，还可以统一将样式表放在文件，或者将样式文件加入到资源文件。

- 斗气：qss内容写得到处都是，哪里需要就写在哪里，各种控件调用 setStyleSheet方法传入样式表内容，或者直接对应控件鼠标右键d出菜单选择改变样式表填入内容；

- 斗者：qss内容放在文件，读取文件内容设置样式表，程序发布的时候带上qss文件；

- 斗师：qss文件作为资源文件放到qrc文件，直接编译到可执行文件中，防止篡改凳裤改；

- 斗灵：在qss文件中自定义一些标志充当变量使用，读取以后替换对应的变量为颜色值，类似动态换肤；

- 斗王：放在文件容易被篡改，集成到可执行文件不够灵活，一旦样式表更新需要重新编译文件，如何做到既能只更新样式表文件，又不需要重新编译可执行文件，又粗竖能防止被篡改：采用rcc命令将资源文件编译生成二进制，只需要替换该二进制文件即可；

- 斗皇：继承qstyle类自己实现完成所有样式接口，统一整体风格，大名鼎鼎的UOS系统默认规则就是如此，不允许用样式表，全部painter绘制；

在 上一篇 中表格已经变得工整了不少，不过看上去还是太素了。在这个看脸的时代这是不行的。那怎么办呢？别担心,Qt最擅长就是干这个了。接下来就用Qt的样式表给表格上点颜色。

我们从表头开始，先给弄它弄个背景色，另外字体加粗以示区别。

Qt使用setStyleSheet函数来设置部件的样式表。这里QHeaderView表示表头，section表示表头上层的可选中的区域，由于设置了最后一行拉伸，所以是看不到section下一层的界面。

现在看来表头是凸起的，而且也不够高，接着在设置。

这一步加了三个伍游迟属性及对应的值，第一个border：none去掉了section的边框。第二个height:35px，设置高度为35像素。顺便设置了第三个color:white设置文字的颜色为白色。 这样看上去舒服多了。接下来给表格也设置一些颜色:

这一步给表格设置了三个属性及对应的值，第一个是gridline-color:#2aaee4,设置网格线的颜色，#2aaee4是用十六进制表示颜色的方法。第二个是color:#888,设置文字的颜色，#888相当于#888888。最后一个是border:none去掉了表格边框，这样看起来更清爽一点了。

如果表格中的行数非常多的话，经常会看走眼了。所以我磨世们要设置间隔行颜色不同以示区分。对于表格需要先开启间隔行背景色的功能，默认间隔行背景色是灰色的，我们可以在样式表中控制这个颜色。

在样式表中使用alternate-background-color属性来控制间隔行的颜色。设置的是偶数行的颜色。如果想设置奇数行腔李的颜色可以通过设置表格的背景颜色来实现。

---