BootStrap2学习日记17---导航路径和分页
导航路径
代码:
<ul class="breadcrumb">
<li><a href="#">Home</a><span class="divider">></span></li>
<li class="active">Product List</li>
</ul>
效果:

分页器
代码:
<div class="pagination">
<ul>
<li><a href="#">1</a></li>
<li class="active"><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
</ul>
</div>
效果:

代码:
<div class="pager">
<ul>
<li><a href="#">上一页</a></li>
<li><a href="#">下一页</a></li>
</ul>
</div>
效果:

代码:
<div class="pager">
<ul>
<li class="previous"><a href="#">上一页</a></li>
<li class="next"><a href="#">下一页</a></li>
</ul>
</div>
效果:

BootStrap2学习日记17---导航路径和分页的更多相关文章
- BootStrap2学习日记15----选项卡
导航格式1: <ul class="nav nav-tabs"> <li class="active"><a href=" ...
- BootStrap2学习日记14----导航
<div class="navbar navbar-inverse navbar-fixed-top"> <div class="navbar-inne ...
- BootStrap2学习日记3--响应式布局实用类
BootStrap2中常用的响应式布局类如: visible-phone 仅在 手机平台显示 visible-tablet 仅在 平板电脑显示 visible-desktop 仅 ...
- BootStrap2学习日记2--将固定布局换成响应式布局
概要:响应式页面是指页面根据浏览平台(尺寸)的不同显示不同的CSS. 原理:在Html的的头加入代码 <style> /*当浏览器宽度大于767是 采用括号里面的CSS样式*/ @medi ...
- BootStrap2学习日记23---图片轮播
<div id="carousel1" class="carousel slide"> <div class="carousel-i ...
- BootStrap2学习日记22---点击展开
先看效果: Code: <div class="accordion" id="accordion2"> <div class="ac ...
- BootStrap2学习日记21---消息提示
<p><a href="#" title="中国(China),位于东亚,是一个以华夏文明为主体.中华文化为基础,以汉族为主要民族的统一多民族国家,通用 ...
- BootStrap2学习日记20---定制缩略图
先看看效果: 代码: <ul class="thumbnails"> <li class="span3"> <div class= ...
- BootStrap2学习日记19---缩略图
缩略图 代码: <ul class="thumbnails"> <li class="span3"><a href="# ...
随机推荐
- 异步编程之Promise(3):拓展进阶
异步编程系列教程: (翻译)异步编程之Promise(1)--初见魅力 异步编程之Promise(2):探究原理 异步编程之Promise(3):拓展进阶 异步编程之Generator(1)--领略魅 ...
- HDU1001
求和 #include<stdio.h> int main() { long n; while(scanf("%ld",&n)!=EOF){ long i; ; ...
- CCD摄像机与CMOS摄像机区别
CCD摄像机 什么是CCD摄像机? CCD是Charge Coupled Device(电荷耦合器件)的缩写,它是一种半导体成像器件,因而具有灵敏度高.抗强光.畸变小.体积小.寿命长.抗震动等优点. ...
- ecshop二次开发
模板开发首页参考资料: http://book.ecmoban.com/ http://pan.baidu.com/s/1bnezFUv 自行修改ecshop读写分离设置,请查看另一篇文章,ecsho ...
- junit4学习(Annotation)
在一个测试类中,所有被@Test注解修饰的public,void方法都是testcase,可以被JUNIT执行. @Retention(value=RUNTIME) @Target(value=MET ...
- Lync2010升级到2013之账户启用!
打开ADUC,将用户添加到 csadministrator 组中:
- android 自定义adapter和线程结合 + ListView中按钮滑动后状态丢失解决办法
adapter+线程 1.很多时候自定义adapter的数据都是来源于服务器的,所以在获取服务器的时候就需要异步获取,这里就需要开线程了(线程池)去获取服务器的数据了.但这样有的时候adapter的中 ...
- DevExpress控件使用经验总结
转自:http://www.cnblogs.com/wuhuacong/archive/2011/08/31/2161002.html
- 编写 Window 服务程序
编写 Window 服务程序 一.直观认识Windows服务. 打开Windows“控制面板/管理工具/服务”,系统显示Windows服务列表. ...
- Hadoop on Mac with IntelliJ IDEA - 6 解决KeyValueTextInputFormat读取时只有key值问题
本文讲述使用KeyValueTextInputFormat在Hadoop 0.x正常工作.Hadoop 1.2.1失效的解决过程. 环境:Mac OS X 10.9.5, IntelliJ IDEA ...