html - 如何在 Shiny 的应用程序的navbarPage中设置tabPanel标题的颜色？

我想在navbarPage中设置tabPanels标题的颜色。我尝试了不同的方法，但不知道该怎么做。以下是可重现的示例。我也尝试了其他方法，但是没有任何效果。

library(shiny)
ui <-shinyUI(bootstrapPage(
  "",

  navbarPage(
    tags$style(HTML("
                  .tabbable > .nav > a  {font-weight: bold; color:black}
                  .tabbable > .nav > li > a[data-value='t1'] {color:red}
                  .tabbable > .nav > li > a[data-value='t2'] {color:blue}
                  .tabbable > .nav > li > a[data-value='t3'] {color:green}
                  .tabbable > .nav > li[class=active]    > a {color:aqua}
                  ")),
    tabPanel("t0",h2("normal tab")),
    tabPanel("t1",h2("red tab")),
    tabPanel("t2",h2("blue tab")),
    tabPanel("t3",h2("green tab")),
    tabPanel("t4",h2("normal tab")),
    tabPanel("t5",h2("normal tab"))
  )
  ))
server <- function(input, output) {}
shinyApp(ui=ui,server=server)

最佳答案

它不是.tabbable而是.navbar元素。

要查找命名的元素，请在任何浏览器中打开Shiny应用程序，然后检查您要改编的元素。所有元素名称和样式均显示在检查 Pane 中。

在下面的示例中，我添加了一些更具适应性的元素和奇怪的颜色。

library(shiny)
ui <-shinyUI(bootstrapPage(
  "",

  navbarPage(
    tags$style(HTML("
        .navbar-default .navbar-brand {color: cyan;}
        .navbar-default .navbar-brand:hover {color: blue;}
        .navbar { background-color: gray;}
        .navbar-default .navbar-nav > li > a {color:black;}
        .navbar-default .navbar-nav > .active > a,
        .navbar-default .navbar-nav > .active > a:focus,
        .navbar-default .navbar-nav > .active > a:hover {color: pink;background-color: purple;}
        .navbar-default .navbar-nav > li > a:hover {color: black;background-color:yellow;text-decoration:underline;}
        .navbar-default .navbar-nav > li > a[data-value='t1'] {color: red;background-color: pink;}
        .navbar-default .navbar-nav > li > a[data-value='t2'] {color: blue;background-color: lightblue;}
        .navbar-default .navbar-nav > li > a[data-value='t3'] {color: green;background-color: lightgreen;}
                  ")),
    tabPanel("t0",h2("normal tab")),
    tabPanel("t1",h2("red tab")),
    tabPanel("t2",h2("blue tab")),
    tabPanel("t3",h2("green tab")),
    tabPanel("t4",h2("normal tab")),
    tabPanel("t5",h2("normal tab"))
  )
))
server <- function(input, output) {}
shinyApp(ui=ui,server=server)

关于html - 如何在 Shiny 的应用程序的navbarPage中设置tabPanel标题的颜色？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52968447/