设为首页
加入收藏
站点地图
首页 | 网站建设 | 杭州FPGA培训班,浙江FPGA培训班,苏州FPGA培训班,昆山FPGA培训班,常州FPGA培训班优化 | 网站推广 | 网络营销 | 网站运营 | 网站策划 | 在线讨论 | 下载中心
您当前的位置:WebSite -> 网站建设 -> 文章内容正文->用户体验:利用css+div 使鼠标经过按钮发生变化效果
 子栏目导航
 热门文章
 相关文章
 

用户体验:利用css+div 使鼠标经过按钮发生变化效果

作者:佚名  来源:转载  发布时间:2008-8-25 9:34:08  

在HTML页面上我们经常会看到一些变化效果,这样子的页面一般都受到大家的喜欢,

  因为1.它很好的给用户作出引导;2.这样的效果使整个页面不会那么的乏味,变得可爱起来。

  那么如何实现这种鼠标经过按钮发生变化效果呢?

  第一步: 我们设计效果图中的按钮图片image.gif,作出鼠标经过时所要产生的效果图片image_over.gif;

  第二步:要鼠标经过按钮发生变化效果那么就要用到“active动态伪类触发”,那么它的代码就是:

  a:link, a:visited {

  display: block;

  width: 60px;

  height: 20px;

  line-height: 40px;

  color: #FFF;

  text-decoration: none;

  background: #e9e9e9  url ( images / image.gif )  no-repeat  left  top;

     text-indent:40px;}

    a:hover {

    background: #FF0S42  url ( images / image_over.gif )  no-repeat  left  top;

    color:#ccc;}

小提示:image.gif 是用于正常状态的图片   image_over.gif 是用于鼠标停留状态的图片

 [返回上一页] [打 印] [收 藏]
百度中查看“用户体验:利用css+div 使鼠标经过按钮发生变化效果”相关文章

版权申明:本站网站建设资源来源网络,如有侵犯您的版权,请来Q告知 我们会在24小时内删除!

Copyright © 2008-2010 www.mepeixun.com All Rights Reserved
服务QQ:52466268 邮箱:meipeixun@163.com
备案号:苏ICP备07200130号