border属性
实际上,border并不是一个单独的属性,在Qt样式表中,它通常指的是一系列与边框相关的属性的组合。然而,你也可以在一条样式规则中一次性设置所有这些值,如下所示:
QPushButton { border: 2px solid #007BFF; /* 四个边框宽度均为2px,样式为实线,颜色为蓝色 */
}
border-width
border-width属性用于设置边框的宽度。
1)这个属性可以接受一到四个值,分别对应边框的上、右、下、左(顺时针方向)的宽度,当指定不同数量的值时,它们的含义如下:
- border-width: 2px; 这表示所有四个边框(上、右、下、左)的宽度都被设置为2px。
- border-width: 2px 7px; 在这种情况下,第一个值2px应用于上下边框(即顶部和底部边框的宽度都是2px),而第二个值7px应用于左右边框(即左侧和右侧边框的宽度都7px)。
- border-width: 2px 5px 8px; 这里,第一个值2px是顶部边框的宽度,第二个值5px是左右边框的宽度,第三个值8px是底部边框的宽度。左侧和右侧边框的宽度是相同的,因为它们共享第二个值。
- border-width: 2px 3px 4px 6px; 这是最具体的形式,允许你为每个边框分别设置宽度。第一个值2px是顶部边框的宽度,第二个值3px是右侧边框的宽度,第三个值4px是底部边框的宽度,第四个值6px是左侧边框的宽度。
2)通过其他方式设置
QPushButton {border-top-width: 1px;border-right-width: 2px;border-bottom-width: 3px;border-left-width: 4px; /* 分别设置各边框的宽度 */
}
border-style
border-style属性定义了边框的样式。以下是一些border-style属性常用的值
- none:边框不显示。这意味着边框的宽度为0,或者边框的样式设置为不可见。
- dotted:定义点状边框。边框由一系列圆点组成,圆点之间的空间由边框宽度和点的样式共同决定。
- dashed:定义虚线边框。边框由一系列短划线组成,短划线之间的空间是均匀的。
- solid:定义实线边框。边框是连续的、不间断的线。
- double:定义双边框。这通常意味着有两条平行线,它们之间的空间以及每条线的宽度都取决于border-width的设置(两条线和它们之间的空间总共为border-width值,故该值太小可能显示为单线边框)。不过,在Qt中,双边框的具体渲染可能会因平台或控件的不同而有所差异。
- groove:定义3D凹槽边框的效果。这种边框看起来像是控件表面上的一个凹槽。边框的颜色可能比控件的背景色更暗,以营造内嵌效果。但是,具体的视觉效果可能取决于边框颜色和控件的背景色。
- ridge:定义3D凸槽边框的效果。与groove相反,这种边框看起来像是控件表面上的一个凸起。边框的颜色可能比控件的背景色更亮,以营造浮雕效果。
- inset 和 outset:这两个值分别用于创建内嵌和浮雕的3D边框效果。inset 使边框看起来像是控件的一部分,向内凹陷;而outset 则使边框看起来像是从控件表面凸出的。然而,与groove和ridge类似,这些效果的精确外观也取决于边框颜色和控件的背景色。
border-color
border-color属性用于设置边框的颜色。你可以指定一个颜色值(如颜色名、十六进制颜色代码、RGB/RGBA值等)。
QPushButton { border-color: #007BFF; /* 蓝色边框 */
}
/* 或者为每一边指定不同的颜色 */
QPushButton { border-top-color: red; border-right-color: green; border-bottom-color: blue;border-left-color: yellow;
}
border-radius
设置边框的圆角半径。
可以指定一个值:所有角相同,
两个值:水平和垂直方向
四个值:分别对应左上角、右上角、右下角、左下角。
border-image
使用图像作为边框。这是一个更高级的特性,允许你指定一个图像,该图像将被平铺、拉伸或缩放以覆盖控件的边框区域。
QPushButton { border-image: url(:/images/border.png)
}
注意事项
1. border-style默认样式是 none:无边框。如果控件(如QLineEdit、QLabel等)没有设置边框样式或者边框样式被设置为none,即使设置了border-width和border-color,边框实际上还是不可见的。
2. border-width属性,其默认值通常是0。这意味着,如果不设置边框宽度,控件将不会有可见的边框,因为边框的宽度被设置为零。
3. border-color默认值
- 如果控件(如QPushButton、QLabel等)没有设置边框样式(border-style)或者边框样式被设置为none,那么边框实际上是不可见的,因此讨论边框颜色的默认值在这种情况下并不适用。
- 如果控件的边框样式被设置为可见(如solid、dashed等),并且没有指定border-color,则边框颜色的默认值通常会遵循以下规则:继承自父元素、主题或默认样式等。故:使用时最好指定颜色,防止在不同环境下颜色显示不一致。