Qt：在QScrollArea上应用样式表使水平滚动条消失，但对垂直滚动条工作得很好

我正在尝试为QScrollArea的滚动条应用一些样式表，我的样式表如下

QScrollBar:vertical {

  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;

  background-color: rgb(240, 240, 240);
  width: 15px;
  margin: 21px 0 21px 0;
}

QScrollBar::handle:vertical {

  background-color: rgb(200, 200, 200);
  min-height: 25px;

}

 QScrollBar::add-line:vertical {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}

QScrollBar::sub-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}


  QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
      background: none;
  }

QScrollBar::up-arrow:vertical
{
  image: url(:/BarIcon/Icons/uparrow.png);
}

QScrollBar::down-arrow:vertical
{
  image: url(:/BarIcon/Icons/downarrow.png);
}

QScrollBar:horizontal {
  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;
  background-color: rgb(240, 240, 240);
    width: 15px;
    margin: 0px 21px 0 21px;
 }

 QScrollBar::handle:horizontal {
    background-color: rgb(200, 200, 200);
    min-height: 25px;
 }
QScrollBar::add-line:horizontal {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: right;
    subcontrol-origin: margin;
 }

 QScrollBar::sub-line:horizontal {
  border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: left;
    subcontrol-origin: margin;
 }

 QScrollBar:left-arrow:horizontal
{
  image: url(:/BarIcon/Icons/leftarrow.png);
}

QScrollBar::right-arrow:horizontal 
{
  image: url(:/BarIcon/Icons/rightarrow.png);
}

QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
     background: none;
}

这个样式表完美地实现了垂直滚动条的功能，但是当出现与

QScrollBar:horizontal

相关的任何单个样式表时，滚动条就消失了

有人能指出我的缺点吗？我该怎么办

注: 通过使用Qt Designer的

Change styleSheet

选项，已将样式表应用于QScrollara对象

---

如果水平滚动条显示此样式表，请向我致谢。

你很幸运，今天我也遇到了同样的事情

这真的很简单，这是因为你只是复制过去的垂直样式的水平，只是改变单词“垂直”为“水平”，但实际上还有一些事情要改变：

• “宽度”参数在水平方向变为“高度”
• “高度”参数变为“宽度”
• “上”和“下”变成“左”和“右”（你做到了）
• 此外，如果你有不对称的利润或类似的，不要忘记适应他们（你也这样做了）

这为您的特定案例提供了以下样式表：

QScrollBar:vertical {

  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;

  background-color: rgb(240, 240, 240);
  width: 15px;
  margin: 21px 0 21px 0;
}

QScrollBar::handle:vertical {

  background-color: rgb(200, 200, 200);
  min-height: 25px;

}

 QScrollBar::add-line:vertical {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}

QScrollBar::sub-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}


  QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
      background: none;
  }

QScrollBar::up-arrow:vertical
{
  image: url(:/BarIcon/Icons/uparrow.png);
}

QScrollBar::down-arrow:vertical
{
  image: url(:/BarIcon/Icons/downarrow.png);
}

QScrollBar:horizontal {
  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;
  background-color: rgb(240, 240, 240);
    height: 15px;
    margin: 0px 21px 0 21px;
 }

 QScrollBar::handle:horizontal {
    background-color: rgb(200, 200, 200);
    min-width: 25px;
 }
QScrollBar::add-line:horizontal {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: right;
    subcontrol-origin: margin;
 }

 QScrollBar::sub-line:horizontal {
  border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: left;
    subcontrol-origin: margin;
 }

 QScrollBar:left-arrow:horizontal
{
  image: url(:/BarIcon/Icons/leftarrow.png);
}

QScrollBar::right-arrow:horizontal 
{
  image: url(:/BarIcon/Icons/rightarrow.png);
}

QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
     background: none;
}