css实现footer定位
<!DOCTYPEhtml><htmllang="en"><head>
<metacharset="UTF-8">
<metaname="viewport"content="width=device-width,initial-scale=1.0">
<metahttp-equiv="X-UA-Compatible"content="ie=edge">
<title>Document</title>
<scriptsrc="http://csdnimg.cn/public/common/libs/jquery/jquery-1.9.1.min.js"type="text/javascript"></script>
<style>
html,body{
width:100%;
height:100%;
margin:0;
padding:0;
}
*{
margin:0;
padding:0;
}
.box{
width:100%;
min-height:100%;
padding-bottom:50px;
box-sizing:border-box;
background:#e4e4e4;
}
.content{
background:#fff;
border-bottom:1pxsolid#999;
}
button{
margin:10pxauto;
line-height:30px;
width:20%;
}
footer{
height:50px;
line-height:50px;
text-align:center;
margin-top:-50px;
background:#fff;
}
</style>
</head>
<body>
<divclass="box">
<buttononclick="beLong()">变长</button>
<pclass="content"id="content">内容</p>
</div>
<footer>footer</footer></body><script>
functionbeLong(){
document.getElementById('content').style.height='1000px';
}</script>
</html>


本文转载自中文网


本文转载自中文网
如需转载,请注明文章出处和来源网址:http://www.divcss5.com/rumen/r57070.shtml