CSS Android 和 iOS 问题
当我尝试将 div 拉伸 100% 时,iOS 和 Android 的末尾会出现一条小线。这是更好的视图图片:
我在网上搜索,但没有找到解决方案。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=0.666" />
<style>
html, body {
position:relative;
height:100%;
width:100%;
padding:0;
margin:0;
overflow-x:hidden;
}
header {
width: 100%;
background: red;
height: 50px;
display: block;
margin: 0;
padding: 0;
overflow-x:hidden;
}
</style>
</head>
<body>
<header>asdasd</header>
</body>
</html>
When i try to stretch a div 100% there is a little line at the end in iOS and Android. Here's a pic for better view:
I searched all over the net but i didn't find a solution.
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=0.666" />
<style>
html, body {
position:relative;
height:100%;
width:100%;
padding:0;
margin:0;
overflow-x:hidden;
}
header {
width: 100%;
background: red;
height: 50px;
display: block;
margin: 0;
padding: 0;
overflow-x:hidden;
}
</style>
</head>
<body>
<header>asdasd</header>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这可能是为滚动条保留的空间。
That's probably the space reserved for a scrollbar.
试试这个:
然后,为了确保您的内容不会由于绝对定位而出现在标题下方,请为正文标记提供与标题高度相同的顶部填充:
Try this:
Then to make sure your content doesn't wind up under the header due to absolute positioning, give the body tag the same top padding as the height of the header: