1、bootstrap给我们提供了标签页

　　细细看了一下bootstrap的标签页源码，对tab选项卡有了更深的理解。其实说来也简单，以前自己写js和css时没有意识到整体的划分。就是分为两部分：一部分是标签页头部，一部分就是标签页展示内容区域。

2、使用bootstrap的自带样式

3、自带样式还是有点难看，需要自己修改一下

bootstrap建立响应式网站——tab选项卡的更多相关文章

  1. 使用bootstrap建立响应式网页——头部导航栏

    1.要建立响应式网站的布局,这个时候bootstrap的高级就能体现出来了. 2.先来了解一下bootstrap提供了哪些响应式工具供我们使用: (1)屏幕宽度尺寸的概念: <768px     ...

  2. Metronic-最优秀的基于Bootstrap的响应式网站模版

    在所有我看到过的基于Bootstrap的网站模版中,Metronic是我认为最优秀的,其外观之友好.功能之全面让人惊叹.Metronic 是一个自适应的HTML模版,提供后台管理模版和前端内容网页模版 ...

  3. 使用bootstrap建立响应式网页——通栏轮播图（carousel）

    1.bootstrap提供了js插件——轮播图 我们还是照旧,直接拿过来用,需要改的地方再说. 2.修改 小屏幕看小图,大屏图看大图:这个可以利用自定义属性(data-XXX)data-img-lg( ...

  4. 使用Bootstrap 3开发响应式网站实践05,使用Tab、Modal、Form展示内容,使用Popover、Tooltip展示提示信息

    本篇体验用Tab插件显示内容.Html部分为: <div class="row" id="moreInfo"> <div class=&quo ...

  5. 使用Bootstrap 3开发响应式网站实践07,页脚

    页脚部分比较简单,把一个12列的Grid切分. <footer> <div class="container"> <div class="r ...

  6. 使用Bootstrap 3开发响应式网站实践06,使用ListGroup、Thumbnails展示内容

    □ ListGroup展示内容 当希望把同类型的内容以列表.区块展示的时候,ListGroup是不错的选择. <div class="col-sm-6"> <h3 ...

  7. 使用Bootstrap 3开发响应式网站实践04,使用Panels展示内容

    在Bootstrap页面中,通常用Panels来展示主要功能的内容.该部分Html为: <div class="row" id="featureHeading&qu ...

  8. 使用Bootstrap 3开发响应式网站实践03,轮播下方的内容排版

    通常把一些重要信息.需要重点标注的信息放在轮播的下方显示,这部分区域用到了大字体的标题.副标题以及段落文字等. <div class="row" id="bigCa ...

  9. 使用Bootstrap 3开发响应式网站实践02,轮播

    本篇体验图片轮播.html部分为: <div class="carousel slide" id="myCarousel" > <!--Ind ...

随机推荐

  1. JavaConcurrentHashMap

    JavaConcurrentHashMap 大滕翼不自觉地往前探了探身子可还没等他听到唐寅说到 兆咒耶Т √靼脶摹 す宿坩曹 '字'心'上都有横您老瞧瞧这个'宣德 炔灌莞 蹇忄в 幼銮亿辽 仄黛境 ...

  2. Linux 配置VNC远程桌面

    X11 提供的 display manager 为 xdm ,而著名的 KDE 与 GNOME 也都有自己的 display manager 管理程序,分别是 kdm 与 gdm .你可以透过三者中任 ...

  3. passwd总结

    1.当前用户是root root用户修改密码 ,直接 passwd[不要输入当前用户密码] 如果修改其他用户密码,需要 passwd 用户名 如: passwd sc 短短的密码,如123也能通过,因 ...

  4. 为PO手写添加配置文件（hbm.xml）

  5. nextSibling，previousSibling，childNodes常见错误

    在使用nextSibling与previousSibling时,常出现选不到预计对象的情况 eg: <div class="a">1</div> <d ...

  6. Lua 迭代器

    第一种:lua迭代器的实现依赖于闭包(closure)特性 1.1 第一个简单的写法 --迭代器写法 function self_iter( t ) local i = 0 return functi ...

  7. opencv----人脸美白算法，祛斑，祛痘，磨皮等

    现在各种手机camera软件都自带图像美颜处理,但是成熟的算法在网上很难搜到,博主也是自己摸索了自己做出来了,跟美图秀秀的处理效果相比,还不错,感觉很好,所以PO上来,与各位博友分享之. 首先是根据网 ...

  8. php cookies自动登录

    <?php header('Content-type: text/html; charset=utf-8'); error_reporting(0); //自动登陆 if($_COOKIE[&q ...

  9. 天棋哥哥大战AlphaGo

    天棋哥哥大战AlphaGo Time Limit: 1 Sec  Memory Limit: 128 MB Submit: 20  Solved: 9 [Submit][Status][Web Boa ...

  10. HDU1896Stones(优先队列)

    Stones Time Limit : 5000/3000ms (Java/Other)   Memory Limit : 65535/32768K (Java/Other) Total Submis ...