html - 如何分别控制Shiny中selectInput的标签和选择文本的字体大小样式？

Question

我在 Shiny 中有一个 selectInput 小部件。

我 想分别控制 label 参数和小部件本身的输入文本(即 choices 和 selected 参数的文本)的字体大小。

最初的 [无样式] 输出如下所示:

selectInput(inputId = "inId", label = "Different Font Size...", choices = "...From This")

我尝试使用 div() 像这样:

div(style = "font-size: 8px", 
    selectInput(inputId = "inId", label = "Different Font Size...", choices = "...From This")

)

这会缩小 label 文本和输入文本(即来自 choices 的文本)。

注意:这与将 div(style = ...) 方法用于 textInput 形成对比，后者只会影响 label 文本(而不是输入文本)。

在这种情况下，我将在 tags$style("#inId {font-size:8px;}") 函数之后使用 textInput 来分别修改输入字体大小。

div(style = "font-size: 8px", 
    textInput(inputId = "inId", label = "Different Font Size...", value = "...From This")
), tags$style("#inId {font-size:14px;}")

但是，这不适用于 selectInput() 。

在 tag$style(...) 包装器之后指定 div(style = ...) 似乎对生成的文本样式没有任何影响。

  div(style = "font-size: 8px", 
      selectInput(inputId = "inId", label = "Different Font Size...", choices = "...From This")
  ), tags$style("#inId {font-size:14px;}")
  )

那么我该怎么做呢？

如何使用 Shiny 为 label 小部件分别控制 choices 和 selectInput 文本的文本样式(特别是字体大小)？

同样，我的目标是实现以下能力:

如果重要:我使用的是 Shiny_1.0.3 和 R 版本 3.4.0

Answer 1

您可以将整个 selectInput() 以及 标签本身 包装在具有单独字体大小的 div() 中。标签的样式会覆盖外层 div 的样式。

shinyApp(
  ui = fluidPage(
    div(style = "font-size:20px;",
      selectInput(inputId = "inId", label = div(style = "font-size:80px", "Different Font Size..."), 
                  choices = c("...From This", "Test")
                  )
      )
  ),
  server = function(input, output) {

  }
)

我希望这有帮助。
干杯