在闪亮仪表板的 header 部分的同一行中添加图像和标题

Question

我创建了一个闪亮的仪表板，我在其中设置了 titleWidth 和侧边栏宽度 = 0 以便隐藏它们。然后我想在 header 部分的左角添加一个完全适合 header 部分的图像，然后在同一行但在右角添加标题。正如您现在看到的，header 部分变大了，而且标题似乎比图片低了一行。这是我的代码：

library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
library(shinyjs)
dbHeader <- dashboardHeaderPlus(
    titleWidth = "0px",
    tags$li(a(href = 'http://https://www.uow.edu.au/',
              img(src = 'download.png',
                  height = "55px",width="232px"),
              style = "padding-top:0px; padding-bottom:0px; padding-right:1690px;padding-left:90px;"),
            class = "dropdown")
    
)
shinyApp(
    ui = dashboardPagePlus(
        header = dbHeader,
        sidebar = dashboardSidebar(width = "0px"),
        body = dashboardBody(
            useShinyjs(),
            
            tags$head(tags$style(".skin-blue .main-header .logo { padding: 0px;}")),
            
            tags$head(tags$style(HTML(
                '.myClass { 
        font-size: 25px;
        line-height: 50px;
        text-align: left;
        font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
        padding:  1500px;
        padding-bottom: 0 0px;
        padding-top: 0 0px;

        overflow: hidden;
        color: black;
      }
    '))),
            tags$script(HTML('
      $(document).ready(function() {
        $("header").find("nav").append(\'<span class="myClass"> Life,Death & Statins </span>\');
      })
     '))
            
            
            
        )
        
    ),
    server<-shinyServer(function(input, output,session) { 
        hide(selector = "body > div > header > nav > a")
        
    }
    )
)

Answer 1

也许您正在寻找这个。您可以使用填充和边距来获得适当的间距。

mytitle <- paste0("Life, Death and Statins")

dbHeader <- dashboardHeaderPlus(
  titleWidth = "0px",

  tags$li(a(href = "https://www.mit.edu/", #   'http://https://www.uow.edu.au/',
            div(style = "margin-left:-15px;margin-bottom:-44px;margin-top:-15px;padding: 0px 1190px 0px 0px ; width: 290px;",
                img(src = 'YBS.png', height = "55px",width="232px")),
            div(style="display: inline; padding: 0px 90px 0px 750px ; font-size: 40px ; width: 300px;",HTML(mytitle, "<br>"))
            ),
          class = "dropdown")
)

在闪亮仪表板的 header 部分的同一行中添加图像和标题

Add image and title in the same row of the header section of a shiny dashboard

r

shiny

shinydashboard