如何去除QDockWidget标签栏下方的1px黑色线条？

我在QMainWindow中集成了QDockWidget窗口，但TabBar下方出现了一条仅1px的细黑线，这条线条颜色似乎与背景色一致。不过我尝试修改QMainWindow的默认background-color样式后，该线条仍未消失。

以下是我的样式表，我通过qApp->setStyleSheet()设置QSS：

QDockWidget {
    border: 1px solid #22222A;
    /* titlebar-close-icon: none; */
    titlebar-normal-icon: none;
}

QDockWidget>QWidget {
    background: #22222A;
}


QDockWidget::close-button {
    subcontrol-origin: margin;
    subcontrol-position: right;
    padding: 2px;
    image: url(:/icons/d_close.png);
}

 QDockWidget::float-button {
    subcontrol-position: right bottom;
    image: url(:/icons/d_reduce.png);
    size: 20px 20px;
    padding: 2px;
} 

QDockWidget::title {
    color: #DCDCDC;
    background: #22222A;
    padding: 4px 10px;
    border: 1px solid #22222A;
}

QDockWidget::title:hover {
    color: #DCDCDC;
    background-color: rgba(51, 51, 58, 0.9);
    border: 1px solid rgba(70, 70, 80, 0.5);
}

解决方案 #

这条黑线通常来自QDockWidget内部容器、QMainWindow中央部件边框，或是多dock合并为标签页时TabWidget的默认边框。可以尝试以下几种修改：

1. 清除QDockWidget内部容器边框
   修改QDockWidget>QWidget样式，添加border: none;：

   QDockWidget>QWidget {
       background: #22222A;
       border: none;
   }
   

2. 移除QMainWindow中央部件边框
   给QMainWindow的centralwidget添加样式：

   QMainWindow::centralwidget {
       border: none;
   }
   

3. 处理TabBar相关边框（多dock合并场景）
   如果是多个QDockWidget合并为标签页显示，清除TabBar和TabWidget的默认边框：

   QTabBar::tab {
       border-bottom: none;
   }
   QTabWidget::pane {
       border: none;
   }
   

4. 统一DockWidgetArea样式
   确保QMainWindow的dock区域背景和边框与主题一致：

   QMainWindow::dockWidgetArea {
       background: #22222A;
       border: none;
   }
   

可以逐个尝试以上修改，通常前两种就能解决问题。

内容的提问来源于stack exchange，提问作者Caffrey