Qt学习Qt随笔Qt

Qt随笔 - QSS属性详解(一)

2017-07-31  本文已影响139人  静_谷

QSS类似于网页设计里面的CSS样式,在Qt中用来描述界面。

界面美化必备杀器啊~

这篇文章主要是借鉴了Qt内置帮助文档“Qt Style Sheets Reference”,各位也可以自行查看

Qt Style Sheets Reference文档

好了,这篇文章深入解释了“List of Properties”一节

下表列出了Qt样式表所支持的所有属性。属性的值取决于属性的类别。除非另有说明,以下属性适用于所有控件。标有星号(*)的属性是Qt特有的,CSS2或CSS3中没有与其等价的属性。

1. alternate-background-color

交替背景色用于修饰QAbstractItemView的子类
如果这个属性未被设置,默认值为QPalette::AlternateBase
例子:

 QTableWidget{
 alternate-background-color: blue;
 background: yellow;
 }
效果
注意!请先启用交替背景色属性
ui->tableWidget->setAlternatingRowColors(true);

2. background

不用多说,就是背景属性,跟下面几个差不多,可以相当于background-color, background-image, background-repeat, 或者 background-position。
支持 QAbstractItemView 子类, QAbstractSpinBox 子类, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip, and plain QWidgets.


3. background-color

控件的背景色
例子:

QLabel { background-color: white }
QLineEdit { background-color: rgb(255, 0, 0) }
QMainWindow{background-color: #FCFAF2}

可以支持RGB、HTML或者RGBA(可以指定透明色,取值在0到1之间)颜色

RGBA的用法:
QLineEdit { background-color: rgba(255, 0, 0,0.5) }

4. background-image

用于控件的背景图像。如果图像有透明部分则显示透明部分。
例子:

QLabel {background-image: url(://logo) }
注意!请先在Qt中插入资源

5. background-repeat

设置是如何重复背景图像



例子:

QMainWindow {
background-image: url(://logo);
background-repeat: repeat-x;
}
repeat-x

下面的例子就不给代码了


repeat-y
no-repeat
注意!Qt实际没有inherit这个值!

6. background-position

设置背景图像的位置
topbottomleftrightcenter五个值
例子:

QLabel {
background-image: url(://logo);
background-repeat: no-repeat;
background-position: center;
}

7. background-attachment

设置背景图像是否固定或者随着页面的其余部分滚动


8. background-clip

规定背景的绘制区域
有三个值borderpaddingcontent
这个需要结合盒子模型


9. background-origin

相对于内容框来定位背景图像
和background-clip一样有三个值borderpaddingcontent
具体例子看看W3School上面的(传送门


还有很多属性等下次再讲吧。
�其实有很多属性可以直接当CSS在W3School来查,很方便。

上一篇下一篇

猜你喜欢

热点阅读