在 shiny 應用程序中更改 sliderInput 文本的顏色

Question

我試圖僅將 s liderInput()的值(1,2,3,...10)的字體顏色從黑色更改為白色，但它不會發生。 slider如何與css文件連接？

 ui <- fluidPage(
  tags$style(type = "text/css", "
      .irs-grid-text {font-family: 'arial'; color: white; bottom: 17px; z-index: 1;}
    "),
  sliderInput(inputId="test", label=NULL, min=1, max=10, value=5, step = 1, width='100%')
)

server <- function(input, output, session){
  
}

shinyApp(ui = ui, server=server)

Answer 1

您可以將重要的添加到 CSS 以使其正常工作。 我知道不理想 - 也許為您的 CSS 使用外部文件可能會起作用。

library(shiny)

ui <- fluidPage(
  tags$head(
  tags$style(HTML(type = "text/css", "
      .irs-grid-text {font-family: 'arial'; color: white !important; bottom: 17px; z-index: 1; }
    "))),
  sliderInput(inputId="test", label=NULL, min=1, max=10, value=5, step = 1, width='100%')
)

server <- function(input, output, session){
  
}

shinyApp(ui = ui, server=server)

Answer 2

此外，您可以將.js-irs-0放入 CSS 以引用您的 slider。 我把紅色用於顯示目的。

color = "orange"
ui <- fluidPage(
  tags$style(type = "text/css", "
     .js-irs-0 .irs-grid-text {font-family: 'arial'; color: red; bottom: 1px; z-index: 1;}
    "),
  setSliderColor(color,c(1)),
  sliderInput(inputId="test", label=NULL, min=1, max=10, value=5, step = 1, width='100%')
)

server <- function(input, output, session){
  
}

shinyApp(ui = ui, server=server)