带有CSS的选项卡面板样式（多个样式），R

我只想在站点的主菜单中使用修改后的tabsetPanel样式。它居中，没有边框或灰色阴影

我想第二次使用tabsetPanel，所以我想，改变整个样式不是一个好主意

如何使我的样式仅适用于主菜单？我试图添加一个带有

tabsetPanel（…）%%>%tagAppendAttributes（class=“mainmenu”）

的类“mainmenu”，但该类的位置不正确（我认为它需要位于

）

这是我的密码：

library(shiny)

ui <- fluidPage(
  tags$head(
    tags$style(HTML("
      
      .nav {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        margin: 0;
        width: 100%;
        padding: 10px;
        display: block;
      }

      .nav-tabs > li {
        float:none;
        display:inline-block;
        zoom:1;
      }

      .nav-tabs {
        text-align:center;
        border-bottom: #cccccc !important;
        border-bottom-style: solid !important;
        border-bottom-width: 1px !important;
        font-size: initial;
      }
      
      .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
        color: #555;
          cursor: default;
        background-color: #fff;
          border: none;
        border-bottom-color: transparent;
      }
      
      .nav>li>a:focus, .nav>li>a:hover {
        text-decoration: none;
        background-color: transparent;
      }
      
      .nav-tabs>li>a {
        margin-right: 2px;
        line-height: 1.42857143;
        border: 0px solid transparent;
        border-radius: 0px 0px 0 0;
      }
    "))
  ),
  
  fluidRow(
    column(width = 2),
    column(width = 8,
           tabsetPanel(
             tabPanel("main", "MENU"),
             tabPanel("more", uiOutput("hello"))
           ) %>% tagAppendAttributes(class = "mainmenu")),
    column(width = 2)
  )
)

server <- function(input, output, session) {
  output$hello <- renderUI({
    list(
      fluidRow(
        column(width = 4, "menu"),
        column(width = 8,
               tabsetPanel(
                 tabPanel("first", "one"),
                 tabPanel("second", "two")
               ))
      )
    )
  })
}

shinyApp(ui, server)

库（闪亮）
ui%tagAppendAttributes（class=“mainmenu”），
列（宽度=2）
)
)
server您可以将每个元素（在本例中为fluidRow）包装在一个div中，并使用一个唯一的类。然后可以分别为每个div定义css。下面的代码以“.main\u menu\u theme”的css片段和一个合成的片段来演示与“.internal\u menu\u theme”的区别

库（闪亮）
用户界面
library(shiny)

ui <- fluidPage(
  tags$head(
    tags$style(HTML("
      
      .main_menu_theme {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        margin: 0;
        width: 100%;
        padding: 10px;
        display: block;
        text-align:center;
        border-bottom: #cccccc !important;
        border-bottom-style: solid !important;
        border-bottom-width: 1px !important;
        font-size: initial;
      }
    .inner_menu_theme {
    
    background-color: cornflowerblue;
    text-align: right;
    font-size: 20px;
    }
    

    ")
    )
  ),
  
  fluidRow(
    column(width = 2),
    column(width = 8,
           tags$div(class = 'main_menu_theme',
                    tabsetPanel(
                      tabPanel("main", "MENU"),
                      tabPanel("more", uiOutput("hello"))
                    ))),
    column(width = 2)
  )
)

server <- function(input, output, session) {
  output$hello <- renderUI({
    list(
      fluidRow(
        column(width = 4, "menu"),
        column(width = 8,
               tags$div(class = 'inner_menu_theme',
                        tabsetPanel(
                          tabPanel("first", "one"),
                          tabPanel("second", "two")
                        )))
      )
    )
  })
}

shinyApp(ui, server)