landy88
2016-12-04 03:47
采纳率: 0%
浏览 865

下拉菜单这种效果是怎么弄的?

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

6条回答 默认 最新

  • threenewbee 2016-12-04 03:55

    http://www.chipown.com.cn/images/menu_subbg.png
    http://www.chipown.com.cn/images/menu_subbotttom.png

    两个渐变的图作为背景
    background: #fafafa url(../images/menu_subbg.png) repeat-x;
    
    打赏 评论
  • 当作看不见 2016-12-04 04:02

    css3有一个渐变可以简单实现
    http://www.runoob.com/css3/css3-gradients.html

    打赏 评论
  • BGeek 2016-12-04 04:17

    这种是用js做的,我目前正在学习

    打赏 评论
  • 陈 俊 刚 2016-12-04 06:06
     .about_left{ width:238px; margin-right:20px; float:left}
    /* 左侧菜单 */
    .about_left ul{ padding-top:5px}
    .about_left li{ font-size:12px;  padding:2px 0 2px 10px;line-height:26px;border-bottom:1px dotted #ccc; }
    .about_left li li{ font-size:12px ;padding-left:15px; padding-bottom:0; line-height:18px;border-bottom:none;}
    .about_left a{ display:block;line-height:26px; color:#008080;  background:url(../images/arrow.jpg) no-repeat 10px 8px; padding-left:20px}
    .about_left li li a{background:url(../images/larrow1.gif) no-repeat 5px 6px;line-height:16px; padding:3px 0 3px 20px }
    .about_left a:hover,.about_left a.hover{ color:#7E3D8E; }
    .about_left li a.selected{ color:#7E3D8E; background-color:#E8E1EA;}
    .about_left li li a.selected,.about_left li li a:hover,.about_left li li a.hover{ background-color:transparent}
    .about_left ul ul{ display:none}
    .about_left h3{ padding-left:20px; color:#137D7D; font-size:14px}
    

    他这个是用css样式做的效果,你可以按F12看看他的代码。。

    打赏 评论
  • landy88 2016-12-04 08:12

    下载下来了,就没有那效果了。

    打赏 评论
  • BGeek 2017-01-15 04:15

    用jquery是最简单的方法

    打赏 评论

相关推荐 更多相似问题