Css 页脚位置在有光泽

Css 页脚位置在有光泽,css,r,shiny,css-position,footer,Css,R,Shiny,Css Position,Footer,我想在一个闪亮的应用程序中调整页脚位置。当页面内容短于视口时,页脚应位于视口底部。当页面内容长于视口时,页脚应位于内容下方。post建议如何通常在CSS中实现它。当手工编写页面的HTML代码时,通常可以直接使用这种和类似的解决方案 在shiny中有关于页脚位置的讨论,其中一些讨论设法将页脚移动到底部。但是,它们无法防止页脚与页面主要内容的底部重叠,这需要缩短主要内容的容器 考虑以下最简单的工作示例: library(shiny) ui <- navbarPage(title = &quo

我想在一个闪亮的应用程序中调整页脚位置。当页面内容短于视口时,页脚应位于视口底部。当页面内容长于视口时,页脚应位于内容下方。post建议如何通常在CSS中实现它。当手工编写页面的HTML代码时,通常可以直接使用这种和类似的解决方案

在shiny中有关于页脚位置的讨论,其中一些讨论设法将页脚移动到底部。但是,它们无法防止页脚与页面主要内容的底部重叠,这需要缩短主要内容的容器

考虑以下最简单的工作示例:

library(shiny)

ui <- navbarPage(title = "Some Example", id = "example",
    tabPanel(title = "Something", value = "something",
        textOutput("some_text")
    ),
    footer = "The footer."
)

server <- function(input, output, session) {
    output$some_text <- renderText(stringi::stri_rand_lipsum(5))
}

shinyApp(ui = ui, server = server)
库(闪亮)

ui我不精通html,页脚需要这样吗

library(shiny)

ui <- navbarPage(title = "Some Example", id = "example",
                 tabPanel(title = "Something", value = "something",
                          textOutput("some_text"),
                          ##add a footer with 2 empty lines and the info to display
                          tags$footer(HTML('
                          <br>
                          <br>
                          <p>Author: Your Name<br>
                          <a href="mailto:your_name@example.com">your_name@example.com</a></p>'))
                 )
                 
)

server <- function(input, output, session) {
    output$some_text <- renderText(stringi::stri_rand_lipsum(15)) #change this number (15) to view how the footer reacts
}

shinyApp(ui = ui, server = server)
库(闪亮)

ui可以有您描述的页脚,但实现起来并不简单。似乎没有一个内置的函数来定位页脚,更不用说以您想要的方式了

因此,我们需要编写一些自定义CSS。为此,我们需要能够以页脚为目标。当我们查看示例生成的HTML时,我们可以看到由参数
footer
指定的内容被简单地包装在带有class
行的
标记中


页脚。
在任何大小合理的闪亮应用程序中,该类都会有多个
s,因此很难编写只针对页脚的CSS。解决方法如下所示:


ui感谢您的建议。然而,它们都没有实现我想要的。第一个选项不会将页脚刷新到视口底部,第二个选项不会将页脚放置在内容下方,以防页面内容比视口长。谢谢。这是一个可爱的答案,也是我一直在寻找的。悬赏还被封锁了12个小时。我会奖励它时,它是可用的。
library(shiny)

ui <- navbarPage(title = "Some Example", id = "example",
                 tabPanel(title = "Something", value = "something",
                          textOutput("some_text"),
                          
                 
#add some empty lines to avoid overlap at the bottom    
tags$div(HTML('   <br>
                  <br>
                  <br>
                  <br>
                  <br>
                  <div class="footer">
                    <p>Author: Your Name<br>
                    <a href="mailto:your_name@example.com">your_name@example.com</a></p>
                  </div>')),
                  tags$style('
                  .footer {
                   position: fixed;
                   left: 0;
                   bottom: 0;
                   width: 100%;
                   background-color: lightgrey;
                   color: white;
                   text-align: right;}')),

tabPanel(title = "no_footer", value = "something",
         textOutput("some_text2")))

                 
                 


server <- function(input, output, session) {
    output$some_text <- renderText(stringi::stri_rand_lipsum(15)) #change this number (15) to view how the footer reacts
    output$some_text2 <- renderText(stringi::stri_rand_lipsum(5))
}

shinyApp(ui = ui, server = server)