html - 在 Rshiny 仪表板中在背景图像上显示内容的问题

Question

我的问题是无法在 rshiny 仪表板的选项卡中使用内联 css 在背景图像上呈现内容。我只设法得到背景图像。

tabItem(tabName = "welcome",
              tags$div(   
                tags$div(
                  tags$img(src='game background image.png',style="position: absolute; 
                         top: 0; 
                         left: 0; 
                         right: 0; 
                         bottom: 0; 
                         margin: auto; 
                         min-width: 50%;
                         min-height: 50%;"),
                  
                tags$div(
                  tags$img(
                    src = "Platershiny game logo.png",
                    style = 'display: block;
                margin-left: auto;
                margin-right: auto;
                width: 50%;'),
                  tags$br(),
                  tags$h2('WELCOME!',
                          style='color:#D6AC18;font-family:Times New Roman;align:center;'),
                  tags$br(),
                  tags$h3(
                    'About Game',
                    style='color:#D6AC18;font-family:Times New Roman;;align:center;'),
                  tags$p("Under construction currently",style='color:#D6AC18;font-family:Times New Roman;;align:center;'),
                  tags$h3("Instructions",style='color:#D6AC18;font-family:Times New Roman;;align:center;'),
                  tags$p("There are no rules for this game yet. We are simply demonstrating the elements of a two-player game.",style='color:#D6AC18;font-family:Times New Roman;;align:center;'),
                  tags$h3("Team Members",style='color:#D6AC18;font-family:Times New Roman;;align:center;'),
                  actionButton("register", "Register"),
                  actionButton("login", "Login"),
                  tags$h4("Logged in as:"),
                  htmlOutput("loggedInAs")
                )
              ),style="position: fixed; 
                       top: -50%; 
                       left: -50%; 
                       width: 200%; 
                       height: 200%;
                       display:flex;"))

没有内容的背景图片

标签： htmlrshinyshinydashboard