Wie kann ich die Hintergrundfarben von glänzenden Registerkartenfeldern anpassen?

Hintergrundfarben in Shiny-Registerkartenfeldern anpassen

In Shiny-Anwendungen bieten Registerkartenfelder eine praktische Möglichkeit, Inhalte in verschiedenen Abschnitten zu organisieren. Um die visuelle Attraktivität zu verbessern, möchten Sie möglicherweise die Hintergrundfarbe der Registerkarten anpassen. Dies kann mithilfe des CSS-Stils erreicht werden.

Standardstil

Standardmäßig verwenden Shiny-Tab-Panels helle Hintergründe für inaktive Tabs und dunklere Hintergründe für aktive Tabs. Der CSS-Selektor .nav-tabs kann verwendet werden, um Hintergrundfarben sowohl auf aktive als auch inaktive Tabs anzuwenden.

Beispiel: Hintergrundfarbe anpassen

Das folgende Codebeispiel zeigt, wie So passen Sie die Hintergrundfarbe sowohl der aktiven als auch der inaktiven Registerkarten an:

<code class="r">ui <- shinyUI(
  fluidPage(
    tags$style(".nav-tabs { background-color: #FF0000; } .nav-tabs li.active a { background-color: #0000FF; }"),
    tabsetPanel(
      tabPanel(title = "Hello"),
      tabPanel(title = "World")
    )
  )
)

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

shinyApp(ui, server)</code>

In diesem Beispiel haben die inaktiven Registerkarten eine rote Hintergrundfarbe, während die aktive Registerkarte eine blaue Hintergrundfarbe hat.

Einzelne Tabs anpassen

Sie können auch die Hintergrundfarbe einzelner Tabs basierend auf ihren Tab-Werten anpassen. Dies kann mithilfe von CSS-Selektoren erreicht werden, die auf bestimmte Tab-Elemente abzielen.

Beispiel: Anpassen einzelner Tabs

Das folgende Codebeispiel zeigt, wie Sie die Hintergrundfarbe einzelner Tabs anpassen :

<code class="r">ui <- shinyUI(
  fluidPage(
    tags$style(".nav-tabs li a[data-value='t1'] { background-color: #FF0000; } .nav-tabs li a[data-value='t2'] { background-color: #0000FF; }"),
    tabsetPanel(
      tabPanel("t1", title = "Hello"),
      tabPanel("t2", title = "World")
    )
  )
)

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

shinyApp(ui, server)</code>

In diesem Beispiel hat die Registerkarte „Hallo“ einen roten Hintergrund, während die Registerkarte „Welt“ einen blauen Hintergrund hat.

Das obige ist der detaillierte Inhalt vonWie kann ich die Hintergrundfarben von glänzenden Registerkartenfeldern anpassen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!