在這個挑戰中，我們的目標是使用以下方法來增強Shiny 應用程式的外觀tabsetPanels。我們的目標是創建一個 UI，其中所選面板在黑色背景上具有白色文本，而非活動選項卡則保持白色背景和黑色文本。
以下是使用的程式碼說明解決方案：
library(shiny)
ui <- shinyUI(
fluidPage(
tags$style(".nav-tabs {
background-color: #006747;
}
.nav-tabs-custom .nav-tabs li.active:hover a, .nav-tabs-custom .nav-tabs li.active a {
background-color: transparent;
border-color: transparent;
}
.nav-tabs-custom .nav-tabs li.active {
border-top-color: #FFF;
}"),
tabsetPanel(
tabPanel(
title = "Hello",
textInput(inputId = "text", label = "Input")
),
tabPanel(
title = "World"
)
)
)
)
server <- shinyServer(function(input, output, session){
})
shinyApp(ui=ui, server=server)該解決方案提供了一個具有視覺吸引力的應用程序，其中活動選項卡以黑色背景和白色文字突出顯示。非活動選項卡仍然可以透過白色背景和黑色文字輕鬆區分。
隨著時間的推移，閃亮的 CSS 很容易發生變化，因此相應地調整程式碼非常重要。然而，該解決方案中概述的核心原則應繼續指導客製化流程。
以上是如何在Shiny的tabPanel中自訂選項卡顏色？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
