r - 在 Shiny App 中增加条带/条带的大小

Question

你能帮我增加我在下面的应用程序中制作的条带/乐队的大小吗？我插入一个图来说明我的想法。这个想法是我增加范围直到我制作的水平线。并且标题“项目描述”位于这个新范围内。

太感谢了！

library(shiny)
library(shinythemes)

ui <- shiny::navbarPage(theme = shinytheme("flatly"),
                        title="Test", collapsible = TRUE,
                        
                        tabPanel("",
                                 
                                 div(
                                   style = 
                                     "height: 80px; background-color: #02BE7F; width: 100%; position: absolute; right:0;",
                                   h2(HTML("Project <b>Description</b>"), 
                                      style="text-align:center;color: white"),
                                   hr(),
                                   
                                   div(
                                     style = "width: 70%; margin: auto;",
                                     h2(HTML("Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
                                      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s"), 
                                        style="text-align:justify"))
                                 )
                                 
                        ))



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

shinyApp(ui = ui, server = server)

标签： rshiny

Answer 1

像这样？

library(shiny)
library(shinythemes)

ui <- shiny::navbarPage(theme = shinytheme("flatly"),
                        title="Test", collapsible = TRUE,
                        
                        tabPanel("",
                                 div(
                                     div(
                                         style = 
                                             "height: 40vh;
                                              background-color: #02BE7F;
                                              width: 100%;
                                              right: 0;
                                              position: relative;",
                                         h2(HTML("Project <b>Description</b>"), 
                                            style=
                                                "color: white;
                                                 position: absolute;
                                                 left: 50%;
                                                 top: 50%;
                                                 transform: translate(-50%);"),
                                         hr(style = "bottom: 0.1px;
                                                     position: absolute;
                                                     width: 100%;"),
                                     ),
                                     div(
                                         style = "width: 70%; margin: auto;",
                                         h2(HTML("Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
                                      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s"), 
                                      style="text-align:justify"))
                                 )
                        ))



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

shinyApp(ui = ui, server = server)