导航路径

代码:

    <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---导航路径和分页的更多相关文章

  1. BootStrap2学习日记15----选项卡

    导航格式1: <ul class="nav nav-tabs"> <li class="active"><a href=" ...

  2. BootStrap2学习日记14----导航

    <div class="navbar navbar-inverse navbar-fixed-top"> <div class="navbar-inne ...

  3. BootStrap2学习日记3--响应式布局实用类

    BootStrap2中常用的响应式布局类如: visible-phone     仅在 手机平台显示 visible-tablet      仅在 平板电脑显示 visible-desktop   仅 ...

  4. BootStrap2学习日记2--将固定布局换成响应式布局

    概要:响应式页面是指页面根据浏览平台(尺寸)的不同显示不同的CSS. 原理:在Html的的头加入代码 <style> /*当浏览器宽度大于767是 采用括号里面的CSS样式*/ @medi ...

  5. BootStrap2学习日记23---图片轮播

    <div id="carousel1" class="carousel slide"> <div class="carousel-i ...

  6. BootStrap2学习日记22---点击展开

    先看效果: Code: <div class="accordion" id="accordion2"> <div class="ac ...

  7. BootStrap2学习日记21---消息提示

    <p><a href="#" title="中国(China),位于东亚,是一个以华夏文明为主体.中华文化为基础,以汉族为主要民族的统一多民族国家,通用 ...

  8. BootStrap2学习日记20---定制缩略图

    先看看效果: 代码: <ul class="thumbnails"> <li class="span3"> <div class= ...

  9. BootStrap2学习日记19---缩略图

    缩略图 代码: <ul class="thumbnails"> <li class="span3"><a href="# ...

随机推荐

  1. phonegap 新窗口 WebView

    自定义WebView窗口打开 import com.ap.work.QuickWeb public class QuickPlugin extends CordovaPlugin { /** * 新开 ...

  2. RAD XE10 Seattle

    RAD Studio 10 Seattle RAD XE10 Seattle RAD 10 Seattle c++builder 10 Seattle Delphi 10 Seattle http:/ ...

  3. 转】MyEclipse使用总结——设置MyEclipse使用的Tomcat服务器

    原博文出自于: http://www.cnblogs.com/xdp-gacl/p/3935499.html 感谢! 一.设置使用的Tomcat服务器 如果不想使用MyEclipse自带的tomcat ...

  4. iPhone 6/6 Plus 出现后,如何改进工作流以实现一份设计稿支持多个尺寸?

    iPhone 6/6 Plus 出现后,如何改进工作流以实现一份设计稿支持多个尺寸? 2014-12-05 09:33 编辑: suiling 分类:iOS开发 来源:知乎(pigtwo)  2 22 ...

  5. C++11右值引用

    [C++11右值引用] 1.什么是左值?什么是右值? 左值是表达式结束后依然存在的对象:右值是表达式结束时就不再存在的对象. 2.std::move的作用是什么? std::move用于把任意类型转化 ...

  6. Windows 7 不同安装模式简要区别(图解)

    ★ 你可能对GHOST不支持AHCI感到迷惑,实际上,写过GHOST一键安装批处理的都知道一个叫FINDCD.EXE的小程序,可是这个程序老 了,AHCI模式光驱他找不到了,找不到光驱动意味着光盘中G ...

  7. Array types are now written with the brackets around the element type

    因为网站翻译的时候应该用的beta/beta2,而再beta4中就会出现问题,解决问题方案: var shopping: String[] = ["Eggs","Milk ...

  8. emWin(ucGui)的Edit控件退格处理方法 worldsing

    在enWin(ucGui)中EDIT控件在数值模式(十进制/十六进制/二进制/浮点数)下编辑是,无法使用BackSpace键进行退格,主要涉及到的函数有: EDIT_SetBinMode() EDIT ...

  9. C#中的结构体与类的区别

    经常听到有朋友在讨论C#中的结构与类有什么区别.正好这几日闲来无事,自己总结一下,希望大家指点. 1. 首先是语法定义上的区别啦,这个就不用多说了.定义类使用关键字class 定义结构使用关键字str ...

  10. 深入理解CRITICAL_SECTION

    临界区是一种防止多个线程同时执行一个特定代码节的机制,这一主题并没有引起太多关注,因而人们未能对其深刻理解.在需要跟踪代码中的多线程处理的性能时,对 Windows 中临界区的深刻理解非常有用.本文深 ...