Question

我正在尝试制作一个简单的网络应用程序，但是我对我的div的定位有一些麻烦

我试图这样做1 large bar top 100% width，1 large bar bottom 100% width {background-color: blue; position: fixed; width: 15%; height: 80%; margin-top: 7%; margin-bottom: 3% }和一个粘贴在左侧并完全适合其他两个栏之间的导航菜单。当我向下滚动时，我也希望它保持原样。

我用于导航菜单的代码是

{background-color: red;
    position: fixed;
    width: 100%;
    height: 7%;
    margin-top: 0;
    margin-bottom: 93%;
}

为顶栏

{background-color: green;
    position: fixed;
    width: 100%;
    height: 3%;
    margin-top: 97%;
    margin-bottom: 0;
}

和页脚

<body><div id="top"></div><div id="menu"></div><div id="footer"></div></body>

将div放在身体中，就像这样

{{1}}

菜单以这种方式放好，但页眉和页脚粘在页面顶部。

谢谢任何可以帮助我的人

Answer 1

对于position：fixed，您需要指定顶部/底部和左侧样式。我认为你不需要这些保证金款式。

#menu {
    background-color: blue;
    position: fixed;
    width: 15%;
    height: 90%;
    top: 7%;
    left: 0;
}
#top {
    background-color: red;
    position: fixed;
    width: 100%;
    height: 7%;
    top: 0;
    left: 0;
}
#footer {
    background-color: green;
    position: fixed;
    width: 100%;
    height: 3%;
    bottom: 0;
    left: 0;
}

如何定位多个div

1 个答案: