首页 > 解决方案 > 动态添加的页脚不会停留在 ASP.NET 页面的底部

问题描述

在项目的某个页面中,我在循环内动态地将面板添加到表单中。当循环结束时,我正在动态添加一个页脚,我想将它放在页面底部。使用的代码和 CSS 类如下:

Form.Controls.Add(new LiteralControl("<div class='form'></ div >" +
                                             "<div class='footer'>  +
                                                    "<p>Copyright © 2019-2020 SiteName.com™. All rights reserved.</p>" +
                                             "</div>"));

   .form {
padding-top: 50px;
position: relative;
z-index: 1;
text-align: center;
min-height: 84vh;

}

 .footer {
font-family: "Roboto", sans-serif;
border: 1px dotted black;
padding: 10px;
bottom: 0;
position: relative;
z-index: 1;
bottom: 0px;

}

我在另一个页面中为页脚使用了完全相同的代码,除了它不是动态加载的,它工作正常,页脚位于页面底部。我该怎么做才能通过动态添加页脚获得相同的结果?

标签: c#cssasp.netfooter

解决方案


<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: red;
   color: white;
   text-align: center;
}
</style>
</head>
<body>

<h2>Fixed/Sticky Footer Example</h2>
<p>The footer is placed at the bottom of the page.</p>

<div class="footer">
  <p>Footer</p>
</div>

</body>
</html> 


推荐阅读