我的模板有一个侧栏,右侧有内容。我希望在侧栏右侧固定页脚但不起作用。
这是示例模板:
<div class="container-fluid">
<div class="row">
<div class="col-sm-4 col-lg-2">
<nav class="navbar navbar-default navbar-fixed-side">
<?php include("side_menu.php"); ?>
</nav>
</div>
<div class="col-sm-8 col-lg-10">
<!-- ******** startBody ******** -->
<?php include("header.php"); ?>
<div class="container">
<div class="row">
<div class="col-xs-12">
<div class="panel panel-info">
<div class="panel-heading">Text</div>
<div class="panel-body">
</div>
<div class="panel-footer"><a href="element.php">...see all</a></div>
</div>
</div>
</div>
</div>
<!-- ******** endBody ******** -->
<?php include("footer.php"); ?>
</div>
</div>
</div>
如何解决? 感谢
答案 0 :(得分:0)
将以下所有内容粘贴到网址http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_default&stacked=h中以查看有效的演示,希望这会对您有所帮助。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 60px;
background-color: #f5f5f5;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-sm-4 col-lg-2" style="background-color:red;">
NNNNNNNNN
</div>
<div class="col-sm-8 col-lg-10 "style="background-color:green;">
BBBBBBBBBBB <br/>
</div>
<div class="row">
<div class="col-md-offset-4 col-lg-offset-2 col-sm-8 col-lg-10 footer">FFFFFFFFFF<div>
</div>
</div>
</div>
</div>
</body>
</html>