如何修改Shiny应用UI中滑块的年份文本颜色为黑色？

要将Shiny应用滑块下方的年份文本（2015和2023）从白色改为黑色，只需在现有样式代码中针对滑块两端极值文本的CSS类添加颜色属性即可。以下是修改后的完整代码：

ui <- fluidPage(

 tags$head(
    tags$style(HTML("
      /* 自定义滑块样式 */
      .js-irs-0 .irs-bar, .js-irs-0 .irs-bar-edge, .js-irs-0 .irs-slider, .js-irs-0 .irs-min, .js-irs-0 .irs-max {
          background: #808080; /* 滑块元素设为灰色 */
          border-color: #808080; /* 滑块边框设为灰色 */
          color: #000 !important; /* 将两端年份文本设为黑色 */
      }
  
      .js-irs-0 .irs-line, .js-irs-0 .irs-from, .js-irs-0 .irs-to, .js-irs-0 .irs-single {
          background: #D3D3D3; /* 滑块轨道设为浅灰色 */
      }
  
      .js-irs-0 .irs-grid-text {
          color: #000; /* 网格上的年份文本设为黑色 */
      }
    "))
 )
 # 此处添加你的其他UI组件
)

关键修改说明 #

滑块两端的年份文本对应CSS类是.irs-min和.irs-max，在原有样式块中添加color: #000 !important;即可覆盖默认的白色文本样式，!important用于确保该样式优先级高于默认样式。

滑块效果截图：

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