如何在R Shiny中为单个单独的selectInput菜单设置样式? [英] How to style an single individual selectInput menu in R Shiny?

问题描述

可以将CSS样式应用于单个selectInput菜单吗?

Can you apply css style to a single selectInput menu?

我在其他文章中找到了有关样式化selectInput菜单样式的代码，但是结果会影响应用程序中的所有样式.我只想操作单个菜单. 我还在考虑根据服务器中发生的条件为单个元素添加样式，但这是另一个单独的问题.

I've found code in other articles that deal with styling selectInput menu's but the outcome affects all of them in the app. I would like to just manipulate individual menus. I'm also considering adding style to individual elements based on conditionals happening in the server, but that's for another separate question.

测试应用代码:

library(shiny)
library(shinydashboard)
library(shinyjs)
ui  <- 
  fluidPage(
  hr("how do we get the change the style elements of a single select input?) 
tags$style(type='text/css',  .selectize-input  { font-size: 8px; line-height: 8px;} 
             .selectize-dropdown { font-size: 8px; line-height: 8px; }"),

    selectInput("choice", "choices", c("A", "B", "C")),

    selectInput("choice2", "choices", c("D", "E", "F"))
     )

server < - function(input, output, session) {   }
})
shinyApp(ui = ui, server = server)

这种方法直接来自Dean Attali在这里的答案:例题和类似的问题作为最后评论被问到，但没有答案，所以我决定对此事发一个问题，因为我有同样的问题.

This approach comes straight from Dean Attali's answer here: examp, and a similar question is asked as final comment, but no answer, so I decided to post a question on the matter since I have the same problem.

对于其他元素(例如textInput字段)，我通常这样做的方式是:

for other elements likea textInput field, the way I usually do this is by this:

tags$style(type='text/css', "#NAMEELEMENT {background-color: green; height: 40px; border-color: #bfbfbf; width: 520px; position: relative;left: 3%}"), 

您可以在其中通过#及其inputId将tag $ style附加到元素.

where you can attach the tag$style to an element by # and its inputId.

干杯.

推荐答案

我自己找到了答案.决心，谷歌和Stackoverflow上的大量时间以及我发现由Dean Atali创建的一些信息的结合，我相信，但这似乎可以做到:

I found the answer myself. Combination of determination, lots of hours on google and Stackoverflow etc with some info I found created by Dean Atali I believe, but this seems to do it:

  tags$head(tags$style(HTML('.selectize-input {white-space: nowrap}
    #choice+ div>.selectize-dropdown{width: 660px !important}
    #choices+ div>.selectize-dropdown{width: 300px !important}')))

这篇关于如何在R Shiny中为单个单独的selectInput菜单设置样式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！