gpt4 book ai didi

html - 如何摆脱页面上的滚动条?

转载 作者:搜寻专家 更新时间:2023-10-31 22:49:02 24 4
gpt4 key购买 nike

我知道这个问题的答案很简单,但我有一个非常简单的 HTML 页面,其中包含 3 个 div - 标题、map_canvas 和侧边栏。我有一些 CSS 可以将所有这些放在需要去的地方。但出于某种原因,我在浏览器窗口中得到了滚动条,我不希望它们出现在那里,我只希望页面能够很好地适应窗口的高度和宽度。非常感谢任何帮助。

我的页面由以下 HTML 组成:

<!doctype html>
<html>
<head>
<title>CSS Exercise</title>
<link rel="stylesheet" href="css/style.css" />
<script src="js/script.js"></script>
</head>
<body onload="initialize()">
<div class="header"></div>
<div id="map_canvas"></div>
<div class="sidebar">
<input id="lat" type="text" />
<input id="lng" type="text" />
</div>
</body>
</html>​

还有这个 CSS:

body {
height: 100%;
width: 100%;
}

html {
height: 100%;
}

.header {
width: 100%;
}

#logo {
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 8px;
}

.sidebar {
float: right;
width: 20%;
height: 100%;
text-align: center;
}

#map_canvas {
float: left;
width: 80%;
height: 100%;
}​

JSFiddle link

最佳答案

这将隐藏任何溢出并防止显示滚动条。

body {
overflow: hidden;
}

关于html - 如何摆脱页面上的滚动条?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10526910/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com