vue開発移動端に底部が隠れた巨大ピット
6838 ワード
理由:vueのscss、lessでcalcを使用して高さを計算します.たとえば、次のようにします.
ボックスモデルを使用してレイアウトを構築することをお勧めします!!!calcを使用して高さを計算しないでください.次は簡単な例です.上下レイアウトを構築します.
height: calc(100vh - 42px);
ボックスモデルを使用してレイアウトを構築することをお勧めします!!!calcを使用して高さを計算しないでください.次は簡単な例です.上下レイアウトを構築します.
<html>
<head>
<meta charset="utf-8">
<style>
html,body{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
overflow:hidden;
}
.box{
box-sizing:border-box;
position:relative;
padding-bottom:50px;
height: 100%;
}
.box .box-content {
height: 100%;
width: 100%;
overflow: auto;
background-color: yellow;
}
.box .footer {
position: absolute;
background-color: red;
bottom: 0;
left: 0;
height: 50px;
width: 100%;
}
style>
head>
<body>
<div class="box">
<div class="box-content">div>
<div class="footer">div>
div>
body>
html>