CSS网页布局入门教程9:用CSS设计网站导航(2)


[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]


 预览一下效果,已经像个导航的模样了,不过鼠标移上去没有任何响应,这样对于用户体验来说是非常不友好的,因此需要通过一些带有交互反馈的操作来提示用户对象是可以点击的:
#nav li a:hover { background-color:#bbbbbb; color:#ffffff;}
  这次预览效果,用鼠标移上一个频道,响应出现了,这样我们的导航已经变得友好多了。


[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]


初级导航模块完成,不妨对比一下使用表格式布局和css而已在这方面的优劣,你会发现,css的优势是显而易见的。
  注:从本节开始不再写出具体详细的制作步骤,如果你对其中的部分不明白,可以在本节留言;对css掌握不熟练的朋友,建议再温习前几节,平时多用dreamweaver做一些实例,慢慢会逐步掌握的。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzdwfy.html