Question

我有一个图像菜单栏。为菜单栏创建翻转图像的最佳方法是什么？

我在VB.Net中使用Visual Studio 2008

Answer 1

如果是背景图片，您可以使用css：hover选择器更改背景图片。

Answer 2

您可以使用菜单控件CSS Friendly Adapters和CSS Sprites的组合。

我已经完成了很多这些，所以请随时提出任何问题。

最后，你需要这样的东西：

<ul id="nav">
  <li><a href="page1.aspx" id="page1">Page 1</a></li>
  <li><a href="page2.aspx" id="page2">Page 2</a></li>
  <li><a href="page3.aspx" id="page3">Page 3</a></li>
  <li><a href="page4.aspx" id="page4">Page 4</a></li>
</ul>

样式就是这样：

#nav li { float: left; }
#nav a { height: 30px; width: 150px; background: transparent url("bg.png") no-repeat scroll left top; }
#nav a#page1:hover { background-image-position: -30px 0; }

等。等...

你必须设置每个元素的背景图像位置，但是关于图像精灵的教程应该可以帮助你。

不幸的是，Asp.Net中的Css菜单适配器没有在每个元素上放置ID。我编辑了源代码来执行此操作，但如果您不需要Menu控件为您提供的抽象，您可能只想使用html。

Answer 3

你也可以做一个css解决方案。它涉及创建图像翻转的更多工作，即在图形设计方面。

请参阅http://clearleft.com/

中的css

在ASP.Net中创建翻转图像

3 个答案: