简单的导航分页效果
来源:互联网 发布:使用ping命令测试网络 编辑:程序博客网 时间:2024/05/21 07:12
<body><div class="wrap" > <ul> <li class="section checked"> page1</li> <li class="section"> page2</li> </ul></div><div> <div class="page page1"> 这是第一个分页 </div> <div class="page page2"> 这是第二个分页 </div></div>
下面是css
.section{ cursor: pointer; border: 1px solid #00a0e9; border-radius: 3px; padding-left: 10px;}.checked{ cursor: pointer; border: 1px solid #E45A3A;}.page1 { display: block; width: 500px; margin: 0 auto;}.page2 { width: 500px; margin: 0 auto; display: none;}.wrap ul li { float: left; list-style: none;/*去掉默认的圆点符号*/ padding: 10px; margin-left: 10px;}
只是实现最简单的效果,没有做任何美化,望见谅
阅读全文
0 0
- 简单的导航分页效果
- 简单的分页效果
- WPF简单分页导航的实现
- 一般app底部导航栏的分页效果
- 简单的分页效果(servlet实现)
- 非常简单的JS分页效果
- 使用jQuery实现简单的分页效果
- JSP分页导航简单封装
- 一个简单的左侧导航栏滚动时悬浮效果
- 强大和简单的顶部导航栏效果
- 导航效果的实现
- .NET中使用datagrid实现的简单分页效果
- .NET中使用datagrid实现的简单分页效果
- .NET中使用datagrid实现的简单分页效果
- .NET中使用datagrid实现的简单分页效果
- SSM框架整合实现简单的分页效果
- jquery.page.js实现简单的分页效果
- displaytag分页导航的国际化
- 学习Javascript数据结构与算法系列笔记(二):栈
- 如何写出健壮的Java代码
- Rendering Problems Exception raised during rendering:
- Character Detection and Recognition 1-MSER
- IDHTTP中文乱码问题
- 简单的导航分页效果
- linux操作系统操作MySQL常用命令
- 最接近的三数之和 _LintCode
- 3105: [cqoi2013]新Nim游戏
- 数据对接—kettle使用知识8
- FPGA时序约束2
- postgresql从入门到菜鸟(二)
- 洛谷 P1060 开心的金明
- 数据对接—kettle使用知识9