然后我们在网页中新建一个div，并新建一个
无序列表并创建4个然后使用浏览器直接打开html文件，查看效果，可以看到我们创建的标签自带有一定的格式，
接下来我们使用下面的代码去除标签的格式，其中：list-style:none表示去除标签的格式width:160px表示设置标签的宽height:240px表示设置标签的高background:#666666表示设置标签的背景色float:left表示设置标签浮动显示，并且为左浮动margin-right:20px表示设置标签右外边距
刷新浏览器中html文件查看效果，
这里我们开始添加动画：
给
标签添加：
transition:transform 0.1s
transform表示变换的属性，0.1上表示表换所需要的时间另外给标签添加鼠标滑动属性
li:hover{cursor:pointertransform:translate(0,-10px)}
cursor:pointer表示鼠标滑过显示为小手形状
transform:translate(0,-10px)translate表示移动，第一个参数为水平移动值，第二个参数为垂直移动值，
进入浏览器直接查看效果，如下图实现了鼠标滑过块，块上移的动画特效，如下图：
这个当然可以实现了，所谓突出显示效果跟滑动门的道理差不多，需要用到的是:hover********************************************************
定义和用法
:hover 伪类在鼠标移到元素上时向此元素添加特殊的样式。
说明
这个伪类应用处于“悬停状态”的元素。悬停定义为用户指示了一个元素但没有将其激活。对此最常见的例子是将鼠标指针移到 HTML 文档中一个超链接的边界范围内。理论上，其他元素也可以处于悬停状态，不过 CSS 没有定义究竟是哪些元素。
激活的、已访问的、未访问的或者当有鼠标悬停在其上的链接，它们会在支持 CSS 的浏览器中以不同的方式显示出来：
********************************************************
我不清楚你说的突出显示的效果，是不是图片变大。
如果是那样的话，可以<img class="big">先定义一下，然后之后img.big:hover {width:多少pxheight:多少px}
就是把它置为顶层就可以了。具体的浮动什么的，依情况而定，写CSS熟悉以后很简单。
或者我觉得直接就可以用滑动门的办法，用两张图来替换就行。
<div id="header">
<ul>
<li><a href="#">Home</a></li>
<li id="current"><a href="#">News</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
#header {
float:left
width:100%
background:yellow
font-size:93%
line-height:normal
}
#header ul {
margin:0
padding:0
list-style:none
}
#header li {
float:left
margin:0
padding:0
}
#header a {
display:block
}
#header li {
float:left
background:url("norm_right.gif")
no-repeat right top
margin:0
padding:0
}
#header a {
display:block
background:url("norm_left.gif")
no-repeat left top
padding:5px 15px
}
#header #current {
background-image:url("norm_right_on.gif")
}
#header #current a {
background-image:url("norm_left_on.gif")
}
嗯，你现在网上看一下滑动门的文章吧，我说的也不是很清楚，只是提供了一个思路，具体的看几个网页模板的代码相应的部分就可以理解了，嗯希望对你有帮助吧。
