这些网页导航按钮是怎样制作的?请问这些网页导航按钮(见附图)是

1.这些网页导航按钮是怎样制作的?请问这些网页导航按钮(见附图)是

今天下午我忽然想到如何用css实现鼠标经过按钮时的不同状态，而且当点击后只有被点击按钮变成 与其它不同，而其它的都相同。

会用css的人都知道，实现鼠标经过按钮时的不同状态很简单，现在 我写个举个例子： 。over { background-image:url("images/ f"); background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; } 。

out { background-image:url("images/ f"); background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; } 。 link { background-image:url("images/ f"); background-position:center cente; background-repeat:no-repeat; width:127px; height:58px； } 而在表格中加上但这样做的效果是，只有当鼠标作用在按钮上是时才起 作用，而鼠标出来后就是out状态了，就算你点击其它按钮，鼠标动作的按钮还是out状态。

这不是我 们要的效果，那么如何才能实现我们要的效果呢？由于我是做界面的（不会程序，唉），只有用最笨 的方法了 方法如下： 。link { background-image:url("images/ f")；/* 紫色 */ background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; display:block; } 。

link a:hover{ background-image:url("images/ f")；/* 黄色 */ background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; display:block; } 。 select a{ background-image:url("images/ f")；/* 蓝色 */ background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; display:block; } 。

select a:link{ background-image:url("images/ f")；/* 蓝色 */ background-position:center cente; background-repeat:no-repeat; width:127px; height:58px; display:block； } 在 ml界面中对于button1（紫色） text 对于button2（紫色） text 在 ml界面中对于button1（紫色） text 对于button2（紫色） text 这样一来，只有链接本页的按钮变色，其它还是原来色啦！而鼠标经过时的那一瞬间的变化包含 在。 link a:hover中了。

/* 基本实现思想就是这样，到于按钮上如果有文字的话如何变，我想你会这个按钮变化后，文字也 不会是个问题的 */ 。

2.PPT导航栏如何制作

材料/工具：PPT20101、首先启动ppt2010找到第一张幻灯片，在第一张幻灯片中输入导航文字内容。

2、然后调整文字内容的位置，使其布局整齐，接着选择第一个导航文字，执行插入-动作命令。3、接着在弹出的动作设置对话框中切换到单击鼠标选项，勾选超链接到，在弹出的超链接到幻灯片对话框中选择需要连接到的幻灯片，点击确定按钮。

4、随后返回到第一张幻灯片中，这个时候你会看到导航文字变了颜色同时也有了超链接。5、接着采用同样的方法，将剩余三个导航文字依次选中，并建立不同的超链接内容6、最后按f5键进行播放幻灯片，点击不同的导航文字就会链接到不同的内容，这样导航按钮就制作完成了。