给你个思路
比如代码大概是这样子：
<ul>
<li><a href="">菜单</a></li>
<li><a href="">菜单</a></li>
</ul>
把最外层的ul设置背景图片。padding:10px
li设置margin-top:10px
a链接设置背景颜色任意，比如白色
这样下来的效果是，一个带有图片背景的菜单区域，通过菜单间隔可看到后面的背景图
最后，在a链接设置hover状态，a:hover{background:transparent}
当鼠标滑过一个链接后，此链接原来设置的背景色没有了，这样就看到了ul的背景图
效果不错的 而且代码也非常少...
至于竖向折叠大同小异了..
css页面折叠可以通过display:block/none 来控制内容显示和隐藏。 同时用js来触发。你的采纳是我前进的动力!
记得好评和采纳，答题不易，互相帮助，
手机提问的朋友在客户端右上角评价点满意即可.
如果你认可我的回答，请及时点击采纳为满意回答按钮！
