Question

我想知道如何改变＆＃34; radioButton＆＃34;和＆＃34; checkboxInput＆＃34;带有css的小部件（标记为$ style（））。

任何帮助表示赞赏！谢谢！

library(shiny)

ui <- shinyUI(fluidPage(
  h3("Hi! I would like to know how to change the style of these widgets with css (tag$style)"),
  h3("I can change the style of sliders, unfortunately I cannot figure out how to do this with 'radioButtons'
     and 'checkboxInput'. I usually inspect HTML-element in my browser and look for the css style, in this case this strategy does not work."),
  br(),
  br(),
  radioButtons(inputId = "ex_radio", label = "How to change my style?",
               choices = c("I want to be red when checked", "I want to be green")),
  br(),
  br(),

  checkboxInput(inputId = "ex_checkbox", label = "I'd like to look bit different as well",
                value = TRUE),

  br(),
  br(),
  h3("Any help is appreciated :) Thank you!")
))


server <- shinyServer(function(input, output) { })

shinyApp(ui, server)

Answer 1

您要更改的文字位于<span>。您可以使用span CSS选择器

选择无线电输入后的第一个element+element

tags$style("input[type='radio']:checked+span{ 
             color: red; 
             }
input[type='radio']+span{ 
   color: green; 
}")

有关详细信息，请参阅here。如果您有多个单选按钮元素，则可以使用#id选择器将此CSS专门应用于其中一个，例如：

#ex_radio input[type='radio']:checked+span{ 
             color: red; 
             }

对于复选框，您可以通过type='radio'替换type=checkbox来执行相同的操作。

改变小部件的样式

1 个答案: