Bootstrap 4粘脚没有粘住

不确定为什么粘脚没有在Bootstrap 4中工作。我有一个TYPO3网站，我是初学者。Bootstrap 4粘脚没有粘住

粘性页脚不粘在页面的底部。

以下是已呈现的页面源的副本。

我基本上从bootstraps docs文件夹复制html文件，然后修改它并将其复制到我的TYPO3模板中。

如果我用内容填充页面，页脚不会粘住 - 我必须向下滚动页面才能看到它。

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
<meta charset="utf-8"> 
 

 
<title>Landing Page</title> 
 
<meta name="generator" content="TYPO3 CMS"> 
 

 
<link rel="stylesheet" type="text/css" 
 
\t href="/typo3temp/assets/css/d42b6e1bdf.css?1507853162" media="all"> 
 
<link rel="stylesheet" type="text/css" 
 
\t href="/fileadmin/templates/landing_page/css/bootstrap.min.css?1507860230" 
 
\t media="all"> 
 
<link rel="stylesheet" type="text/css" 
 
\t href="/fileadmin/templates/landing_page/css/sticky-footer.css?1507861966" 
 
\t media="all"> 
 

 
<script 
 
\t src="/fileadmin/templates/landing_page/js/jquery-3.2.1.min.js?1507862465" 
 
\t type="text/javascript"></script> 
 
<script 
 
\t src="/fileadmin/templates/landing_page/js/tether.min.js?1507862602" 
 
\t type="text/javascript"></script> 
 
<script 
 
\t src="/fileadmin/templates/landing_page/js/bootstrap.min.js?1507854311" 
 
\t type="text/javascript"></script> 
 

 
</head> 
 
<body> 
 
\t <div class="container"> 
 
\t \t <div class="mt-1"> 
 
\t \t \t <h1>Sticky footer</h1> 
 
\t \t </div> 
 
\t \t <p class="lead">Pin a fixed-height footer to the bottom of the 
 
\t \t \t viewport in desktop browsers with this custom HTML and CSS.</p> 
 
\t \t <p> 
 
\t \t \t Use <a href="../sticky-footer-navbar">the sticky footer with a 
 
\t \t \t \t fixed navbar</a> if need be, too. 
 
\t \t </p> 
 
\t \t <div class="row"> 
 
\t \t \t <div class="col">1 of 3</div> 
 
\t \t \t <div class="col">1 of 3</div> 
 
\t \t \t <div class="col">1 of 3</div> 
 
\t \t </div> 
 
\t </div> 
 

 
\t <footer class="footer"> 
 
\t \t <div class="container"> 
 
\t \t \t <span class="text-muted">Place sticky footer content here.</span> 
 
\t \t </div> 
 
\t </footer> 
 
</body> 
 
</html>

来源

2017-10-13 Daryn

请检查你的CSS文件路径... – sajee

@sajee文件路径是正确的。我已经通过查看源文件进行了验证 - >然后点击每个文件以查看它是否加载文本，然后执行。 – Daryn

当我检查您提供的conde片段时，没有任何样式应用于HTML内容。 – sajee

好不容易才弄明白。也许我对“粘滞”是什么有什么误解，但解决方案是改变绝对 - >固定在CSS文件中。

例如来自：

.footer { 
    position: absolute; 
    bottom: 0; 
    width: 100%; 
    /* Set the fixed height of the footer here */ 
    height: 60px; 
    line-height: 60px; /* Vertically center the text there */ 
    background-color: #f5f5f5; 
}

到：

.footer { 
    position: fixed; 
    bottom: 0; 
    width: 100%; 
    /* Set the fixed height of the footer here */ 
    height: 60px; 
    line-height: 60px; /* Vertically center the text there */ 
    background-color: #f5f5f5; 
}

来源

2017-10-13 05:33:08 Daryn

Bootstrap 4粘脚没有粘住

回答

相关问题