如何在 HTML/CSS 中禁用导航栏的滚动条?

问题描述 投票:0回答:1

有一个页面模板,包含导航栏和单独块中的内容。当页面溢出时,滚动条出现在点击导航栏的内容中。滚动条本身是需要的,但只是在内容内部,是否可以在导航栏之后显示它?

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Asd</title> 
  </head>
  <body>

    <div class="navbar">
      <!-- My navbar  -->
    </div>

    <div class="content">
      <!-- Content -->
    </div>

  </body> 
</html>
html css
1个回答
0
投票

如果我没理解错的话,你不想要整个页面的滚动条,就在内容里面吧?

你可以这样实现:

body{
  height: 100vh;
  overflow: hidden;
}
.navbar{
  height: 120px; // or any height you want to your navbar
  // your other styles
}
.content{
  height: calc(100vh - 120px);
  // your other styles
}

希望对您有所帮助!

© www.soinside.com 2019 - 2024. All rights reserved.