QSS 设置样式表

简述

QSS，也即是Qt Style Sheets的缩写。Qt样式表是一种功能强大的机制，它允许您自定义widgets的外观，除了已经可以通过子类化QStyle来实现的功能之外。Qt样式表的概念、术语和语法深受HTML级联样式表(CSS)的启发，且适应于widgets。

设置样式表

• 当需要对整个应用程序设置样式表时，使用QApplication::setStyleSheet() 。

#include "UseQss.h"
#include <QtWidgets/QApplication>
#include <QFile>

int main(int argc, char *argv[])
{
    
    
	QApplication a(argc, argv);

	QFile qss("./Resources/simple.qss"); //.qss文件路径
	//QFile qss(":/UseQss/simple"); //.qss文件在资源文件.qrc中的路径
	if (qss.open(QFile::ReadOnly))
	{
    
    
		qApp->setStyleSheet(qss.readAll());  //对整个应用程序应用样式表
	}
	qss.close();

	UseQss w;
	w.show();
	return a.exec();
}

simple.qss

*{
    
    
	outline: none;
}

QDialog{
    
    
	background-color: rgb(220,220,220);
}

• 当需要对特定widget设置样式表时，使用QWidget::setStyleSheet()。

#include "UseQss.h"
#include <QtWidgets>

UseQss::UseQss(QWidget *parent)
	: QDialog(parent)
{
    
    
	ui.setupUi(this);
	setWindowIcon(QIcon("./Resources/logo.png"));

	//对特定的QPushButton应用样式表
	ui.pushButton->setStyleSheet("QPushButton{color: black; font-size: 10pt; font-family: Microsoft YaHei; background-color: rgb(133, 150, 176); border: none;}"
		"QPushButton:hover{color: rgb(133, 150, 176); background-color: balck;}");
}

效果

参考

1、Qt助手 / Qt Style Sheets
2、CSS https://www.runoob.com/css/css-tutorial.html

稍加整理方便大家参考，如有错误请指正，谢谢！