【问题标题】:fixed menubar css on zoom in and out固定菜单栏 css 放大和缩小
【发布时间】:2015-06-19 12:08:51
【问题描述】:

放大和缩小时网页中的菜单不会固定在如图所示的标题图像:

这个的css脚本如下 #导航菜单{ z指数:99999; 边距顶部:40px; 位置:绝对; 宽度:100%; 边距:0; 填充:0; 最小宽度:90%; 宽度:950px;

 }

 #navMenu li {
  float:left;
  color:#ececec;
  list-style-type:none;
  width:80px;
 }

 #navMenu ul {
  width:970px;
  font-size:16px;
  color:#000000;
 }


#navMenu li a{

height:15px;
float:left; display:inline;
font-weight:700;
float:left;
color:#707070;
display: block;
padding: 8px 12px;
text-decoration: none;display: block;
padding: 8px 12px;
text-decoration: none;
background-image: url(img/image_menubutton.JPG);
border-right:1px solid white;
margin-right:12px;
font-family:"Georgia",Georgia,Serif;
 font-weight:900;
font-size:19px;
text-align: center;
  zoom: 1;
  max-width: 30%;

  }
 #navmenu li.item1{background-image: url(img/about.JPG);}



#navmenu li a:hover {
    color:33CCFF;
}

解决办法是什么?

【问题讨论】:

  • 这不是一个固定定位的菜单栏,这是一个绝对定位的菜单栏。
  • 嗨,AK。是的,我已经写了位置:绝对;在 css 中,但为什么它仍然不起作用??
  • 你应该提供一些html或jsedit或类似的
  • 为什么链接的css属性被提及两次?字体粗细:700;字体粗细:900; display:block??display:inline?

标签: css


【解决方案1】:

如果你使用 position:fixed;然后它在滚动时不会移动,这是我假设你正在寻找的,当缩放相同的东西时,它会保持固定在你想要的位置,也许添加 top:0;左:0;取决于您希望将其放置在哪里-也许尝试添加一些 html ?除此之外,我能帮到你的只有这些了

 #navmenu{ 
  z-index:99999; 
  margin-top:40px; 
  position:fixed;
  width:100%;
  top:0;
  left:0;
  margin:0; 
  padding:0; 
  min-width: 90%; 
  width:950px;
}

 #navMenu li {
  color:#ececec;
  list-style-type:none;
  width:80px;
 }

 #navMenu ul {
  width:970px;
  top:0;
  left:0;
  font-size:16px;
  color:#000000;
 }


#navMenu li a{
 position:fixed;
 height:15px;
 font-weight:700;
 float:left;
 color:#707070;
 display: block;
 padding: 8px 12px;
 text-decoration: none;
 background-image: url(img/image_menubutton.JPG);
 border-right:1px solid white;
 margin-right:12px;
 font-family:"Georgia",Georgia,Serif;
 font-size:19px;
 text-align: center;
 zoom: 1;
 max-width: 30%;
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-03-03
    • 1970-01-01
    • 2012-10-08
    相关资源
    最近更新 更多