如何控制bslib创建的value box内边距？仅修改指定组件

• 给需要移除内边距的value_box添加一个自定义专属类（比如no-padding-value-box），同时保留p-0处理外层卡片的内边距
• 通过自定义CSS，仅选中带有该专属类的value_box内部的.card-body元素，将其内边距设为0

完整示例代码 #

library(shiny)

ui <- fluidPage(
  theme = bslib::bs_theme(version = 5),
  # 添加自定义CSS规则
  tags$style(
    HTML("
      .no-padding-value-box .card-body {
        padding: 0 !important;
      }
    ")
  ),
  # 目标value_box：同时加p-0和自定义类
  bslib::value_box("无内边距测试", "内容", class = "p-0 no-padding-value-box"),
  # 普通value_box：不受影响
  bslib::value_box("普通样式", "对比内容")
)

server <- function(input, output, session) {

}

shinyApp(ui, server)

说明 #

• p-0负责移除外层卡片容器的内边距
• 自定义CSS.no-padding-value-box .card-body精准定位到目标value_box的内部卡片主体，设置padding:0，!important用来确保优先级覆盖默认样式
• 只有添加了no-padding-value-box类的value_box会被修改，其他同类组件不受影响

内容的提问来源于stack exchange，提问作者Giovanni Colitti