其实就是点一个隐藏一个,显示一个,然后用css排下版就可以了
<div id="top">
<ul id="sidebar">
<li class="">v]神州榜</li>
<li class="">[v]香港榜/li>
</ul>
<div id="content">
<div>
<ul class="music">
<li class="one">勇敢的心[汪峰]</li>
<li class="two">勇敢的心[汪峰]</li>
<li class="three">勇敢的心[汪峰]</li>
<li class="four">勇敢的心[汪峰]</li>
<li class="five">勇敢的心[汪峰]</li>
<li class="six">勇敢的心[汪峰]</li>
<li class="seven">勇敢的心[汪峰]</li>
<li class="eight">勇敢的心[汪峰]</li>
</ul>
</div>
<div>
<ul class="music">
<li class="one">勇敢的心[汪峰]</li>
<li class="two">勇敢的心[汪峰]</li>
<li class="three">勇敢的心[汪峰]</li>
<li class="four">勇敢的心[汪峰]</li>
<li class="five">勇敢的心[汪峰]</li>
<li class="six">勇敢的心[汪峰]</li>
<li class="seven">勇敢的心[汪峰]</li>
<li class="eight">勇敢的心[汪峰]</li>
</ul>
</div>
</div>
</div>
#top div ul#siderbar{
height:20px;
line-height:20px;
width:215px;
margin:0 auto;
background:red;
border-bottom:1px solid #5b5b5b;
padding-top:5px;
}
#top div ul#siderbar li{ -- li本来就是区块,可以直接浮动
float:left;
cursor:pointer; ---做成手型
width:60px;
height:20px;
margin-left:5px;
color:#666;
text-align:center;
background:url(images/libg1.gif) no-repeat left center;
}
分享到:
相关推荐
"Android动态切换环境配置-EnvConfigExample_v1.3.0.1.rar" 是一个专为解决这一问题的项目工程,版本号为1.3.0.1,它提供了灵活的环境切换方案,便于开发者快速适应不同阶段的需求。 1. **环境配置的概念** - 环境...
Android动态切换环境配置3.0生产release版
【标题】"jQ手机排行榜标题滑动切换代码"是一个专为手机网站设计的jQuery特效,主要用于在排行榜区域实现标题的滑动切换效果。这种效果能够提升用户在小屏幕设备上的浏览体验,使得有限的屏幕空间得以充分利用,同时...
在Vue3.0框架中,配合Vite构建工具和Ant Design Vue 2.0库,实现动态主题切换是一项常见的需求,特别是在开发具有高度定制化界面的Web应用时。本项目"vue3.0-vite-antd 实现动态切换主题.zip"提供了一种实现方式,...
【在线音乐排行榜小程序源码】是一款专为微信平台设计的小程序应用源代码,它提供了实时更新的音乐排行榜功能,让用户可以轻松浏览并收听当下热门的歌曲。通过这个小程序源码,开发者或爱好者可以深入了解微信小程序...
在SpringBoot项目中,整合Mybatis-Plus并实现多数据源的动态切换,同时支持分页查询是一项常见的需求。以下将详细阐述这个过程中的关键步骤和技术要点。 首先,我们需要引入必要的Maven依赖。这里提到了四个关键...
在Spring Boot项目中实现多数据源动态切换是一项高级特性,能够使应用根据不同业务需求访问不同的数据库,从而实现服务的解耦和数据库操作的优化。该技术的关键在于如何在同一个应用中配置和使用多个数据源,以及...
在这个“微信小程序开发-在线音乐排行榜案例源码.zip”压缩包中,包含了开发一个在线音乐排行榜小程序的全部源代码,这为我们深入学习和实践微信小程序开发提供了宝贵的资料。 首先,我们要了解微信小程序的基本...
Android动态切换环境配置3.0开发debug版
在本项目中,"85、jQ手机排行榜标题滑动切换代码" 是一个使用jQuery实现的移动设备上的排行榜标题动态切换的解决方案。这个功能常见于各种应用或网站的排行榜模块,通过平滑的动画效果,使用户可以方便地浏览不同...
标题中的“jquery实现的全屏广告动态元素切换的广告源码-支持自动切换和手动切换两种切换”指的是一种基于JavaScript库jQuery实现的广告展示技术。这种技术允许广告在全屏模式下动态地切换不同元素,同时提供了两种...
springboot整合redis动态切换每个数据库,
微信排行榜是微信小程序中一种常见的功能,用于展示用户在游戏或特定活动中的排名情况,激励用户参与并提高用户粘性。`wxGameRank-master.zip` 是一个包含微信排行榜实现的代码资源包,专为微信小游戏设计,同时也...
这通常涉及到CSS变量(CSS Custom Properties)的使用,它们是CSS3引入的一种新特性,可以方便地实现主题的动态切换。 1. **CSS变量**: CSS变量允许开发者在CSS中定义可重用的值,这些值可以在整个样式表中引用。...
在IT行业中,构建大型分布式系统时,数据源的动态切换是一项关键能力,它允许系统根据业务需求选择不同的数据库进行操作。本项目“Spring+SpringMvc+MybatisPlus+Aop(自定义注解)动态切换数据源”正是针对这一需求...
JS繁简切换 Code By Sundj. 网络上有一个Edited by tMosport写的JS繁简切换的脚本,我觉得不太方便用。 参考了tMosport的代码重写了这个脚本。希望对你有所有帮助。 适用于各种场合,Firefox, IE,Safari,Opera...
然而,在某些情况下,我们可能需要在运行时根据不同的条件或需求动态地切换数据库,比如在测试环境和生产环境中使用不同的数据库。这个过程就称为“动态切换数据库”。在本文中,我们将深入探讨如何在Java Hibernate...
本文将详细讲解如何在QT环境中实现动态切换应用的语言功能,以满足不同用户需求。 首先,理解QT中的多语言支持机制至关重要。QT使用QTranslator类来处理翻译工作,它能够加载和应用语言翻译文件(通常是.qm格式),...
在企业级应用开发中,动态数据源是一种常见需求,它允许程序在运行时根据不同的业务逻辑切换到不同的数据库。在本项目中,我们将探讨如何利用MyBatis与Spring框架实现动态切换数据源的功能。首先,我们需要理解...
动态切换Theme和Style可以提升用户体验,使得用户可以根据自己的偏好调整应用界面。这篇博客“Android Style\\Theme动态切换”可能探讨了如何在Android应用程序中实现实时改变主题和样式的技巧。 首先,我们需要...