質問:
タブの背景色とテキストの色を変更するにはどうすればよいですか?光沢のある tabPanel で?具体的には、選択したパネルには黒の背景に白のテキストを表示し、選択されていないタブには白の背景に黒のテキストを表示します。
解決策:
これにより、カスタム CSS スタイルを使用してタブの外観を変更できます。以下は、次の方法を示す包括的なコード例です。
コード:
<code class="r">library(shiny) ui <- shinyUI(fluidPage( h1("Colored Tabs"), tags$style(HTML(" .tabbable > .nav > li > a {background-color: aqua; color:black} .tabbable > .nav > li > a[data-value='t1'] {background-color: red; color:white} .tabbable > .nav > li > a[data-value='t2'] {background-color: blue; color:white} .tabbable > .nav > li > a[data-value='t3'] {background-color: green; color:white} .tabbable > .nav > li[class=active] > a {background-color: black; color:white} ")), tabsetPanel( 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)</code>
結果:
このコードは、色付きのタブを持つ光沢のあるアプリを生成します。デフォルトのタブの背景は水色に黒のテキストになります。 「t1」タブは、アクティブでない場合、背景が赤、文字が白になります。背景が青の「t2」と「t3」も同様です。タブを選択すると、黒い背景に白い文字が表示されます。
追加メモ:
以上がShiny tabPanel でタブの背景とテキストの色をカスタマイズする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。