减少 Shiny 中 fileInput 和文本之间的空间答案

【问题标题】：Reduce space between fileInput and text in Shiny减少 Shiny 中 fileInput 和文本之间的空间
【发布时间】：2020-06-20 03:09:52
【问题描述】：

你能帮我减少 Shiny 中 fileInput 和 text 之间的空间吗？我想留下类似于我附上的图的东西。可执行代码如下。

谢谢！

runApp(
  list(ui = fluidPage(
    fileInput("data", h3("Excel database import")), uiOutput("tab"),
  ),
  server = function(input, output, session){
    url <- a("Google Homepage", href="https://www.google.com/")
    output$tab <- renderUI({
      tagList("Access the page:", url)
    })
  })
)

执行shiny时如何：

我希望它是怎样的：

【问题讨论】：

哪个文本？这里有多个元素。您可能指的是 h3/header 或“访问页面”。（或者别的什么？）你尝试过任何 CSS 样式吗？这是处理空白的规范方法，即使在闪亮对象中/周围并不总是直观。
感谢朋友的回复。抱歉，如果不清楚。准确地说，我想减少 fileInput 和文本之间的空间：访问页面。在图像中呈现了我想要的形状。你知道我该怎么做吗？我在上面留下了一张照片，也是我希望的样子。再次感谢

标签： r shiny

【解决方案1】：

作为 Pork Chop 解决方案的替代方案，您可以在要接近的两个元素之间插入一个 div 元素和一个负数 margin-top：

ui = fluidPage(
  fileInput("data", h3("Excel database import")), 
  div(style = "margin-top: -30px"),
  uiOutput("tab")
)

【讨论】：

感谢朋友的回复！
这对我也有用！与其他一些答案不同，这也仅适用于最近的元素而不是整个文档。

【解决方案2】：

您可以对其应用一些style 并使用margin-top 对其进行调整：

library(shiny)
runApp(
    list(ui = fluidPage(
        tags$head(tags$style(' #tab {margin-top:-30px;}')),
        fileInput("data", h3("Excel database import")), uiOutput("tab"),
    ),
    server = function(input, output, session){
        url <- a("Google Homepage", href="https://www.google.com/")
        output$tab <- renderUI({
            tagList("Access the page:", url)
        })
    })
)

【讨论】：

感谢朋友的回复！