11.4 QSS語法聲明-邊框的樣式、寬度、顏色設置

一、QSS語法聲明-邊框的樣式、寬度、顏色設置

1.盒子模型

認識盒子模型(margin外邊距,border邊框,padding內邊距,content內容矩形)(樣式、寬度、顏色)

2.基本概念

順序：上 右 下 左
順序：上下 左右

 '''樣式聲明
        border-style
        border-top-style
        border-right-style
        border-bottom-style
        border-left-style

        # 邊框樣式屬性
        none  無邊框
        dotted  點狀
        dashed  虛線
        solid  實線
        double  雙實線
        groove  定義 3D 凹槽邊框。其效果取決於 border-color 的值
        ridge   定義 3D 壟狀邊框。其效果取決於 border-color 的值
        inset  定義 3D inset 邊框。其效果取決於 border-color 的值
        outset  定義 3D outset 邊框。其效果取決於 border-color 的值
        '''

        '''
        QLabel{
            border-style:dotted dashed solid double;  // 上 右 下 左
        }
        '''

        '''邊框寬度聲明
        border-width
        border-top-width
        border-right-width
        border-bottom-width
        border-left-width
        QLabel{
            border-width:2px 5px 10px 15px;  // 上 右 下 左
            border-width:2px 10px;  // 上下  左右
            border-style:solid;
            border-color:red;
        }
        16px == 1em 
        '''

        '''邊框顏色聲明
        border-color
        border-top-color
        border-right-color
        border-bottom-color
        border-left-color
        QLabel{
            border-color:green black blue red;  // 上 右 下 左
            border-color:green black;  // 上下  左右
            border-style:solid;
            border-width:5px;
        }
        rgb(255, 255, 255)
        #ffffff
        '''

3.代碼

from PyQt5.Qt import *
import sys


class Window(QWidget) :
    def __init__(self) :
        super().__init__()
        self.setWindowTitle("QSS-語法聲明-邊框的樣式、寬度、顏色設置 - PyQt5中文網")
        self.resize(600, 500)
        self.func_list()

    def func_list(self) :
        self.func()

    def func(self) :
        label1 = QLabel('標簽1', self)
        label1.move(100, 200)
        label1.resize(100, 50)
        label2 = QLabel('標簽2', self)
        label2.move(250, 200)
        label2.resize(100, 50)
      

if __name__ == '__main__' :
    app = QApplication(sys.argv)
    window = Window()

    with open('qss11_4.qss', 'r', encoding='UTF-8') as f :
        qApp.setStyleSheet(f.read())

    window.show()
    sys.exit(app.exec_())

qss11_4.qss

    border-style:dotted dashed solid double;
    border-color:red;
}

QLabel{
    border-width:2px 5px 10px 15px;
    border-width:2px 10px;  // 上下  左右
    border-style:solid;
    border-color:red;
}
*/
QLabel{
    border-color:green black blue red;
    border-color:green black;
    border-style:solid;
    border-width:5px;
}

效果：