qt設計器中的偽元素

Question

我想使用偽元素在左側為按鈕創建一條垂直線，並在懸停時變暗，但是 qt-designer styleSheet 不理解我，並且它沒有正確顯示，這是我的代碼：

QPushButton{
position: relative;
padding: 10px 20px;
border: none;
background-color: #fff;
color: #333;
cursor: pointer;
overflow: hidden;
}

QPushButton:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background-color: #C6C6C6;
opacity: 0.5;
transition: all 0.3s ease-in-out;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}

QPushButton:hover:before {
background-color: #7F7F7F;
opacity: 0.8;
}

看起來怎麼樣 在此輸入影像描述 如我所願 在此輸入圖像描述

我嘗試用不同的方式重寫它，但我不太擅長

Answer 1

Qt 不支援 CSS 3.0，但支援 CSS 2.0。 你需要修改你的CSS以獲得你想要的。 具體做法如下：

QPushButton{
position: relative;
padding: 10px 20px;
border: none;
background-color: #fff;
color: #333;
cursor: pointer;
overflow: hidden;
}

QPushButton:hover {
width: 5px;
height: 100%;
border-left: 6px solid #7F7F7F;
opacity: 0.5;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;

opacity: 0.8;
}