如何在Shiny中減少sidebarPanel文本大小？

Question

我將如何減少文字大小和selectInput在我的盒子大小Shiny應用程序？

現在，我有四個selectInput框和相應的標題，它們非常大。 我希望包含多達16個，但尺寸減小。 我在Shiny教程中包含了一個示例ui.R 謝謝你的幫助！

更新：我使用tags$style line更新了以下代碼。 這使文本更小。 現在，我不確定如何使selectInput框更小。

shinyUI(fluidPage(
  titlePanel("censusVis"),

  sidebarLayout(
    sidebarPanel(
      helpText("Create demographic maps with 
        information from the 2010 US Census."),
      tags$style(type='text/css', ".selectize-input { font-size: 10px; line-height: 10px;} .selectize-dropdown { font-size: 10px; line-height: 10px; }")
      selectInput("var", 
        label = "Choose a variable to display",
        choices = c("Percent White", "Percent Black",
          "Percent Hispanic", "Percent Asian"),
        selected = "Percent White"),

      sliderInput("range", 
        label = "Range of interest:",
        min = 0, max = 100, value = c(0, 100))
    ),

    mainPanel(
      textOutput("text1")
    )
  )
))

Answer 1

要減小字體大小，只需在文檔標題中添加一些CSS，定位"selectize-input"和"selectize-dropdown"類的元素。 （這些分別影響選擇欄和下拉菜單中顯示的字體大小。）

要減小控件的寬度，可以將其包裝在fluidRow()並將其分配給該行包含的12列中的一小部分。

這是一個完全可重現的示例，您只需將其復制並粘貼到R中即可運行：

library(shiny)

shinyApp(
    ui = fluidPage(
        tags$head(tags$style(HTML("
        .selectize-input, .selectize-dropdown {
          font-size: 75%;
        }
        "))),    
        titlePanel("censusVis"),
        sidebarLayout(
            sidebarPanel(
                helpText("Create demographic maps with
        information from the 2010 US Census."),    
                fluidRow(column(6,
                       selectInput("var",
                            label = "Choose a variable to display",
                            choices = c("Percent White", "Percent Black",
                                "Percent Hispanic", "Percent Asian"),
                            selected = "Percent White")
                )),
                sliderInput("range",
                            label = "Range of interest:",
                            min = 0, max = 100, value = c(0, 100))
                ),
            mainPanel(textOutput("text1"))
        )
    ),
    server = function(input, output) {}
)