Html 在页面底部设置页脚_Html_Css

Html 在页面底部设置页脚

html css

Html 在页面底部设置页脚,html,css,Html,Css,这是一个测试代码，但我需要在页面的真正底部设置页脚 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> </head> <body> <div class="wrapper">

这是一个测试代码，但我需要在页面的真正底部设置页脚

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <div class="wrapper">
                <?php
                    for($i=0;$i<100;$i++){
                        echo $i."<br>";
                    }
                ?>
        </div>
        <footer>
            Footer<br>
        </footer>
    </body>
<html>

这样可以在页面底部设置页脚，但如果继续滚动页面，我需要将页脚设置在实际末端，当您无法再滚动时，必须将页脚放置在某个位置。

尝试分配给页脚元素：

footer{
position: fixed;
bottom: 0;
}

像这样。。。这就是我认为你的意思

footer {
    background-color: blue;
    min-height: 20%;
    position: relative;
    width: 100%;
}

您应该删除正文的边距和填充，有一个默认的边距和填充，您可以删除它

footer {
    background-color: blue;
    min-height: 20%;
    position: relative;
    width: 100%;
}

html, body {
  height: 100%;
  background-color: grey;
  padding:0;
  margin:0;
}