如何更改 Shinydashboard 中侧边栏的字体大小

Vin*_*Lin 4 r shiny shinydashboard

我是闪亮仪表板的新手,不熟悉 CSS,谁能告诉我如何更改闪亮仪表板中侧边栏的字体大小?非常感谢,下面是我的代码。

library('shinydashboard')
library(shiny)
ui <- dashboardPage(
  dashboardHeader(title = 'Test'),
  dashboardSidebar(
    sidebarMenu(
      menuItem('Tab1', tabName = '1', icon = icon('dashboard')),
      menuItem('Tab2', tabName = '2', icon = icon('th'))
    )),
  dashboardBody(tabItems(
    #First tab content
    tabItem(tabName = '1',
            fluidRow(
              box(plotOutput('plot1', height = 250)),
              box(tilte = 'Controls',
                  sliderInput('slider', 'Number of obs', 1, 100, 50))
            )),
    #Second tab content
    tabItem(tabName = '2',
            h2('Some text here'))
  ))
)

server <- function(input, output) {
  set.seed(122)
  histdata <- rnorm(500)
  output$plot1 <- renderPlot({
    data <- histdata[seq_len(input$slider)]
    hist(data)
  })
}
shinyApp(ui, server)
Run Code Online (Sandbox Code Playgroud)

在此处输入图片说明

小智 7

如果您只想更改侧边栏的字体大小,这里是代码:

library('shinydashboard')
library(shiny)
ui <- dashboardPage(
 dashboardHeader(title = 'Test'),
 dashboardSidebar(
   sidebarMenu(
     menuItem('Tab1', tabName = '1', icon = icon('dashboard')),
     menuItem('Tab2', tabName = '2', icon = icon('th'))
   )),
 dashboardBody(
  tags$head( 
    tags$style(HTML(".main-sidebar { font-size: 20px; }")) #change the font size to 20
   ),
tabItems(
#First tab content
tabItem(tabName = '1',
        fluidRow(
          box(plotOutput('plot1', height = 250)),
          box(tilte = 'Controls',
              sliderInput('slider', 'Number of obs', 1, 100, 50))
        )),
#Second tab content
tabItem(tabName = '2',
        h2('Some text here'))
  ))
)

server <- function(input, output) {
 set.seed(122)
 histdata <- rnorm(500)
 output$plot1 <- renderPlot({
   data <- histdata[seq_len(input$slider)]
   hist(data)
  })
 }
 shinyApp(ui, server)
Run Code Online (Sandbox Code Playgroud)

但是,如果你想要做的CSS更多的变化,我建议你创建一个CSS文件,并用下面的代码调用它在你的闪亮应用:tags$head(includeCSS(path =www/style.css"))

您可以在此处找到更多详细信息和教程:https : //shiny.rstudio.com/articles/css.html