Question

我正在研究这种布局 http://imstillreallybored.com/gridiron/indexx.html

在顶部菜单中我有不同的背景菜单，红色和灰色渐变。我需要灰色渐变继续在页面的菜单右侧，我似乎无法使其工作。我试过绝对定位，但是当你调整浏览器的大小时，它会覆盖不起作用的菜单。我似乎无法想到这样做的正确方法，任何人都有任何想法吗？

Answer 1

您可以为#menuContainer创建一个非常长的背景图像，该图像为半红色和半灰色，然后将其置于中心位置，因此它将始终在左侧保持红色，在右侧保持灰色。它可能是一个hacky解决方案，但这是您在不更改标记的情况下最容易做到的事情。

Answer 2

尝试嵌套几个div。一直运行灰色渐变，然后将红色图像放在另一个div中，然后左对齐。使红色图像像500px宽，它将始终在左侧，但将在菜单下延伸并隐藏。

<div style="background-image:url('grey-gradient.jpg'); background-repeat:repeat-x;">
  <div style="background-image:url('red.jpg'); background-repeat:no-repeat;">
    <div>
      <ul>menu</ul>
    </div>
  </div>
</div>

Css菜单问题

2 个答案: