最详细的QTabWidget的样式设置

一、 QTabWidget简介

QTabWidget提供一个“选项卡栏”和一个“页面区域”，用于显示与每个选项卡相关的页面。默认情况下，选项卡栏显示在页面区域上方，但可以设置TabPosition。每个选项卡都与不同的Widget（称为页面）相关联。页面区域只显示当前页面；所有其他页面都被隐藏。

样式表中涉及的：

1、QTabBar：QTabWidget的选项卡栏

2、 #tab_1.QWidget：QTabWidget中变量名为tab_1的页面（可以从Qt designer对象查看器里看到QTabWidget下面有QWidget，指的就是与每个选项卡相关的页面）；在样式表中用“#”指定对象

二、QTabWidget应用样式后的效果图：

（上图将mainwindow的背景色设置成黑色了）

三、详细的样式设置代码

/*设置TabWidget中tab_1的样式*/
#tab_1.QWidget{background-color: rgb(108, 117, 125, 65);
}/*设置TabWidget中tab_2的样式*/
#tab_2.QWidget{background-color: rgb(108, 117, 125, 65);
}/*设置TabWidget中QTabBar的样式*/
QTabBar::tab{background-color: #0B0E11;font-family:Consolas;    /*设置tab中的文本的字体*/font-size:8pt;color:#ced4da;    /*设置tab中的文本的颜色*/border-top-left-radius: 5px;    /*设置tab的边框的圆角（左上圆角）*/border-top-right-radius: 5px;    /*设置tab的边框的圆角（右上圆角）*/min-width: 8px;padding: 5px;
}/*设置TabWidget中QTabBar的tab被选中时的样式*/
QTabBar::tab:selected{background-color: rgb(108, 117, 125, 65);
}/*设置TabWidget中鼠标悬浮在QTabBar的tab上，但未选中该Tab的样式*/
QTabBar::tab:hover:!selected {background-color: rgb(108, 117, 125, 45);
}/*设置TabWidget的边框的样式*/
QTabWidget::pane {border: 1px solid rgb(108, 117, 125, 65);
}/*当打开多个tab，右侧出现，点击后，可以向前向后的按钮的样式*/
QTabBar QToolButton {border: none;color: rgb(255, 206, 6);background-color: #0b0e11;
}QTabBar QToolButton:hover {background-color: #161a1e;
}

对应的对象查看器：

最详细的QTabWidget的样式设置相关推荐

cad线性标注样式修改在哪里_AutoCAD2016标注样式设置如何打开-AutoCAD2016打开标注样式设置的详细步骤-PC下载网...
AutoCAD2016标注样式设置如何打开-AutoCAD2016打开标注样式设置的详细步骤-PC下载网作者:小靖子来源:PC下载网时间:2020-09-01 10:27:17 还不会在AutoC ...
SVG基本形状及样式设置
前面的话图形分为位图和矢量图.位图是基于颜色的描述,是由像素点组成的图像:而矢量图是基于数学矢量的描述,是由几何图元组成的图像,与分辨率无关.可缩放矢量图形,即SVG,是W3C XML的分支语言之一 ...
滚动条颜色样式设置说明
方案一: css样式详细介绍,网页滚动条样式设置各条语句含义如下: Crollbar-Face-color:滚动条页面颜色设定: Scrollbar-Highlight-Color:滚动条斜面和左面 ...
【最佳实践】授权子账号进行OSS图片样式设置
1.引子:如何授权子账号在控制台针对指定的Bucket设置图片样式呢? [使用场景]:某企业内部有众多Bucket,并且不同的Bucket分别指定了Bucket的管理员.目前Bucket A的管理员期 ...
微信分享和微信H5跳转到APP开放标签wx-open-launch-app使用及样式设置
H5.微信.App唤端相关一.微信分享二.浏览器H5跳转到APP 三.微信H5跳转到APP 一.条件说明二.文档三.重要的设置四.注意点五.样式设置一.微信分享参看:微信分享:后端参数 ...
CAD图纸比例设置不同时CAD标注样式设置为相同的操作教程
CAD图纸中可能很多内容和标注原来不是一张图上,是其他dwg拷贝过来,用很多不同标注样式,其中的CAD标注设置都不同.在最后出图时,有些是需要修改设置的,这个可以在新建初始设置好CAD标注样式解决.下 ...
QGIS 3.10 矢量样式设置
地图由图层构成,为图层设定合适的样式,地图才能达成直观生动的可视化效果.QGIS提供了大量选项,用于为图层设置形形色色的符号(symbology).本教程使用一个文本文件,采用各种可视化技术揭示文本数 ...
C#Winform的DataGridView控件使用详解2—DataGridView表格样式设置及表格操作
C#Winform的DataGridView控件使用详解2-DataGridView表格样式设置及表格操作 DataGridView表格样式设置 DataGridView行序号设置右键弹出控件表格操 ...
oss子账号_【最佳实践】授权子账号进行OSS图片样式设置-阿里云开发者社区
1.引子:如何授权子账号在控制台针对指定的Bucket设置图片样式呢? [使用场景]:某企业内部有众多Bucket,并且不同的Bucket分别指定了Bucket的管理员.目前Bucket A的管理员期 ...