如何在webapplication中制作固定的菜单栏 [英] How to make fixed menubar in webapplication

问题描述

我是html的新手。我有菜单栏，包含我们，关于我们，职业，联系我们。当我滚动页面时，我想要用固定位置制作那个标题。



我这样写css

.header {

Hi,

I am new to html.I have menu bar that contain Home,about us,Careers,Contact us.When i scroll the page,i want to make that header with fixed position.

I write the css like this
.header{

background:black;
    position:fixed;
    width:100%;
     margin: 0 auto;
     padding:0px;
     left:0px;
     display:block;

}

如果我的网页只包含普通网页，则工作正常text.Problem是我的网页中有任何图像，图像正在克服该标题。



和In联系我们页面文本框也克服了标题部分。如何解决那个问题。我必须在我的CSS中添加或删除哪个属性。



谢谢

}
It is working fine if my webpage contain only plain text.Problem is Any Images are there in my webpage that images are overcoming that header.

And In Contact us Page the Text boxes also overcoming the header part.How to solve that problem.Which Property i have to Add or remove from my css.

Thank you

推荐答案

为此，你需要使用，

For this, you need to use,

position: absolute;
top: 0;

现在它将被修复在顶部（顶部坐标为零）。要使它保留在图像和其他文件和资源之上，您应该使用CSS的z-index。像这样，

Now it would be fixed on top (with top co-ordinate zero). To make it stay over the images and other files and resources you should use the z-index of CSS. Like this,

z-index: 100; // suppose

现在，z-index小于100的所有其他元素都将低于此元素。它会飘过它们。

Now all other elements with their z-index less than 100 would be below this element. It would float over them.

这篇关于如何在webapplication中制作固定的菜单栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！