在R Shiny中更改selectInput的背景顏色

Question

我的示例代碼：

library(shiny)

server <- function(input, output) {
}

ui <- fluidPage(
  br(),
  selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE),
  br(),
  selectInput("select2", "Choose: ", c("Alt2.1", "Alt2.2"), selected = c("Alt2.1"), selectize = FALSE, multiple = TRUE)
)

shinyApp(ui = ui, server = server)

我如何更改代碼，以便小部件的背景顏色為select1為紅色， select2為藍色？

編輯：

我試過這個：

div(selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE), style = "background-color: red")

但這不是我要找的！ 相反，我希望選項的背景是紅色的！

Answer 1

按照以下評論的要求編輯

您可以通過樣式標記添加CSS，如下所示：

library(shiny)

server <- function(input, output) {
}

ui <- fluidPage(
  br(),
  tags$style("#select1 {border: 2px solid #dd4b39;}"),
  selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE),
  br(),
  tags$style("#select2 {background-color:blue;}"),
  selectInput("select2", "Choose: ", c("Alt2.1", "Alt2.2"), selected = c("Alt2.1"), selectize = FALSE, multiple = TRUE)
)

shinyApp(ui = ui, server = server)

Answer 2

您可以將以下內容添加為fluidPage的最后一個參數：

    tags$style(
        HTML('
                          #select1{
                          background-color: #ff0000;
                          }
                          #select2{
                          background-color: #0000ff;
                          }
                          '
        )
    )

這樣您就可以在應用中添加自定義CSS。 將此fluidPage傳遞給fluidPage應該可以進行小的更改，但如果使用CSS調整大量元素，您可能會發現將.css文件保存在應用程序的www目錄中更容易。