网站制作一 ： 从简单做起，通过a属性实现导航图片切换

DIV+CSS：

前人之鉴戒：

 

CSS中的超链接a有四个伪属性,解释为：活动状态，已被访问状态，未被访问状态，和鼠标悬停状态。

   a:link
{color:#FF0000}     /* unvisited link */

   a:visited
{color:#00FF00}  /* visited link */

   a:hover
{color:#FF00FF}   /* mouse over link */

   a:active
{color:#0000FF}   /* selected link */

    提示： 在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。

    提示： 在 CSS 定义中，a:active 必须被置于 a:hover 之后，才是有效的。

    提示： 伪类名称对大小写不敏感。

这些在w3c上都有，简单的很，只有你反复的用过之后就会发现简单的很！

 

hover属性的利用：

css代码如下：

a{

   width:150px;
    height:30px;
    display:block;
    background:url(images/a.gif) no-repeat;

}

a:hover{

    background:url(images/a_hover.gif) no-repeat;

}

前台源码：

<a href="#">123</a>

这样就可以实现背景图片的切换，没有必要利用js来实现，今后对于复杂的类似js动态效果也完全可以利用css来实现，例如z-index，position的绝对定位等等都可以的，今后会继续更新博客的！