Table markup

Tag Description
<table> Wrapping element for displaying data in a tabular format
<thead> Container element for table header rows (<tr>) to label table columns
<tbody> Container element for table rows (<tr>) in the body of the table
<tr> Container element for a set of table cells (<td> or <th>) that appears on a single row
<td> Default table cell
<th> Special table cell for column (or row, depending on scope and placement) labels
Must be used within a <thead>
<caption> Description or summary of what the table holds, especially useful for screen readers
<table>
  <thead>
    <tr>
      <th></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>

Table options

Name Class Description
Default None No styles, just columns and rows
Basic .table Only horizontal lines between rows
Bordered .table-bordered Rounds corners and adds outer border
Zebra-stripe .table-striped Adds light gray background color to odd rows (1, 3, 5, etc)
Condensed .table-condensed Cuts vertical padding in half, from 8px to 4px, within all td and th elements

Example tables

1. Default table styles

Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.

<table class="table">
  
</table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

2. Striped table

Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.

Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.

<table class="table table-striped">
  
</table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

3. Bordered table

Add borders around the entire table and rounded corners for aesthetic purposes.

<table class="table table-bordered">
  
</table>
# First Name Last Name Username
1 Mark Otto @mdo
Mark Otto @TwBootstrap
2 Jacob Thornton @fat
3 Larry the Bird @twitter

4. Condensed table

Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).

<table class="table table-condensed">
  
</table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

5. Combine them all!

Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.

<table class="table table-striped table-bordered table-condensed">
  ...
</table>
Full name
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
信息安全高级专员新乡网站优化教育信息安全平台网络与信息安全南川网站制作2016信息安全报告博客营销 blog武汉网站程序北京高端网站定制公司哪家好和营销下载我叫“空”这是我第一世父母起的名字。我有过很多人生,可每一世的生命只有20年,我好像被什么人给控制了,我要打破这种控制,无论我怎么反抗都是竹篮打水,一场空。直到这一世我终于有了结果…………朵拉一夜之间穿越到梦境里,和航仔等伙伴陷入到充满恐怖阴森的泥潭中,他们需要打破重重迷雾逃出来。他们不断的去克服自身的恐惧和怯弱,和伙伴并肩努力战胜了多重关卡,最终都收获了勇敢和蜕变。身边突然出现了一本回忆录。“这是我写的吗?” 所有人都出现在一个神秘的地方。“这是哪里?” 我叫范无咎,是个20岁的年轻人,我希望我能活下去。 我叫范无咎,是个杀手,我已经死了。【女帝+系统,全新世界观,不是完美同人】 开局穿越玄幻世界,叶辰获得女帝养成系统。 但在系统进行绑定之时,周围并没有人族 生灵,叶辰的养成对象,被迫绑定为一棵柳树! 更让他没有想到的是,洛神界的一位无上女帝,竟然重生在这棵柳树上。 于是… “叮!鉴于宿主的养成对象于绝境中重获新生,宿主受到反馈获得混沌体传承!” “叮!鉴于宿主的养成对象进化为草木精灵,宿主受到反馈获得至尊骨传承! “叮!鉴于宿主的养成对象蜕变为九天神女,宿主受到反馈突破到神王境界!” 多年以后,叶辰于神路尽头,俯视着芸芸 众生,心中不免有些感慨。 唉,本想好好养成而已,没想到一个不小心,我竟然成为了无上神帝! 东方君从小无法修炼使其实力微弱,但因一次机遇,激活了体内沉睡着的黄金圣龙,就此获得了不属于这个大陆的力量,从此实力超凡。 结束了东面西方的明争暗斗,最终成为人类的第九代战神,并渡劫成真神。三流大学毕业的杨易,好不容易在广深一家公司混到人事主管的位置,可突如其来的泄密风波,导致他和女友分了手,当他穷困潦倒之际做起了一名凶宅试睡员,偶然间在床底下捡到一个水晶球。 从此,这个世界在他眼中变了…… “叮!恭喜宿主获得程咬金被动-舍生忘死……”通道异变,乱世将至。江辰通过秘术一步先步步先。在这群雄并起的世代,且看我江辰一剑斩妖,一剑除魔,一剑登天。 麒麟山惊现悬疑古墓,竟与叶林拍摄的短剧一模一样? “这是短剧?这是预言家吧!” “我赌一包辣条,这是个盗墓贼。” 全球火爆,美女警官找上门,叶林的身份也藏不住了……平平凡凡的人生,终于迎来了解脱;异世的风正在喧嚣,道路在何方。我只想活下去,任何人都别想夺走,万世风尘不染其身,千种杀机逆转炼神,百般恩仇皆报己身。夏历2222年,黑色的太阳突然从极渊升起,在天穹之上悬挂七日,全球陷入一片黑暗。 此次事件中,整条赤道全线崩坏,水蓝星裂开一道长达4万公里的影渊,横贯东西。 七天后,黑日退去,光明重洒大地。 可当人们欢呼灾难结束之时,却不知无尽的恐怖正从影渊之中醒来。 自此,全球复苏,百鬼夜行。
微博营销是 数字营销与网络营销 网站与微信 网络信息安全协会 重庆整合营销价格 网站怎做 信息安全顾问项目,-1 营销导向企业网站策划 计算机网络安全心得体会 北京营销 公司破产对股东的影响【www.richdady.cn】 特殊学校的教育理念咨询【www.richdady.cn】 纠纷的法律咨询【www.richdady.cn】 耳鸣的环境影响咨询【www.richdady.cn】 家宅磁场干扰的原因【www.richdady.cn】 存不住钱的环境影响【σσЗ8З55О88О√转ihbwel 与女友前世的前世案例【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 婚姻生活不顺的解决方法咨询【企鹅383550880】√转ihbwel 前世缘份的缘分奇迹咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 事业不顺的职业规划咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 长期头脑混沌可能是哪些疾病的前兆咨询【σσЗ8З55О88О√转ihbwel 头脑混沌的环境影响咨询【企鹅383550880】√转ihbwel 内心恐惧胆怯的自我提升咨询【企鹅383550880】√转ihbwel 暗恋的解决方法【企鹅383550880】√转ihbwel 大龄剩女的婚恋困惑如何解决?【企鹅383550880】√转ihbwel 儿子不读书的解决方法威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 潜能开发与自我提升【微:qq383550880 】√转ihbwel 冤亲债主的前世今生【www.richdady.cn】√转ihbwel 冤亲债主干扰的心理影响咨询【企鹅383550880】√转ihbwel 去世的母亲的咨询技巧咨询【σσЗ8З55О88О√转ihbwel 天津市信息安全测评中心 家用网络安全 广东米酒营销 中国移动网络信息安全,-1 网络营销效果评价指标体系 深圳营销型网站公司 微信网页版信息安全吗 营销导向企业网站策划 无锡手机网站制作费用 信息安全考试 网站是什么 杭州 信息安全厂商 宿州网站制作 手机网站建设动态 邢台网站建设服务周到 网站宽屏 南川网站制作 网络安全监控有什么用 全球网络安全公司排名 美国cnci网络安全分析解读 计算机网络安全心得体会 信息安全等级保护北京,-1 风水网络营销 手机网站建设动态 全球营销网 b2b网络营销 过程 香港网站建设 内部局域网的网络安全 免费建立网站 信息安全等保三级标准 公安网络安全技术专业 我眼中的营销 信息技术与信息安全快速播放 网站建设公司广告 信息安全分类 网络安全隐私泄露 可信赖的响应式网站 龙岗营销网站建设 郑州网络营销外包公司 饥饿营销具体意思 无锡手机网站制作费用 万户网站制作 营销策划和销售的区别 陈墨网络营销顾问 房山网络安全小镇 潍坊营销合作 美国cnci网络安全分析解读 营销导向企业网站策划 苏州高端网站建设 家用网络安全 广东米酒营销 中国移动网络信息安全,-1 外贸营销师 网络安全网络信息安全 深圳营销型网站公司 建网站 广州 天津信息安全测评中心 营销导向企业网站策划 我眼中的营销 信息安全等保三级标准 信息安全考试 网站是什么 全球网络安全公司排名 b2b网络营销 过程 宿州网站制作 信息安全常见的漏洞有 网络信息安全检查 邢台网站建设服务周到 珠海企业网站制作费用 西安专业网站建设服务 信息安全法律研究中心 网络营销策划推广方案 网络安全监控有什么用 信息安全分类 美国cnci网络安全分析解读 外贸营销师 济南网站建设和维护 研发信息安全管理,-1 网站快速收录 交易营销的例子 中国信息安全等级 信息安全等级保护北京,-1 开网站成本 北京营销 成都商城营销推广软件 吴世忠 以色列信息安全 微信运营营销的区别是什么 苏州高端网站建设 网络与信息安全 微博营销是 网站和后台 网站快速收录 可信赖的响应式网站 房山网络安全小镇 微信营销的目的 湛江有哪些网站建设公司 新闻源营销 外贸营销体系 网络营销策略的缺点 网络安全监控有什么用 湛江有哪些网站建设公司 山东省信息安全等级 家用网络安全 景县网站建设 山东省信息安全等级 重庆整合营销价格 武汉网站程序 沪江网络营销 莱山网站建设 苏州有哪些网站制作公司 杭州 信息安全厂商 新乡网站优化 上海信息安全???生招聘 烟台网站建设 在网站上显示地图 内部局域网的网络安全 网站的结构 手机网站建设动态 教育信息安全平台 美国cnci网络安全分析解读 厦门网站开发建设 网站宽屏 网站优化哪里好 杭州 信息安全厂商 佛山做网站格 番禺网站建设 营销的基本流程 陈墨网络营销顾问 公安网络安全技术专业 信息技术与信息安全快速播放 北京高端网站定制公司哪家好 信息安全专业创业 陈墨网络营销顾问 常用的网络安全工具 北京营销 为什么有些网站搭建的是php其所有网页均已.htm命名 常用的网络安全工具 网站建设设计 手机网站建设动态 营销策划和销售的区别 重庆整合营销价格 中国信息安全等级 网络营销的实施方法是 饥饿营销具体意思 网络信息安全技术下载 信息安全法律研究中心 计算机网络安全心得体会 和营销下载 潍坊营销合作 spark 信息安全 数字营销与网络营销 武汉网站程序 淄博网站推广国家信息安全研究中心 网络营销效果评价指标体系 网络安全病毒 网络信息安全犯罪案例,-1 网站须知 什么营销是通过微博 淄博网站推广国家信息安全研究中心 网络安全技术图片 网站优化哪里好 营销广告的表现形式 全网营销方案及布局 博客营销 blog 全球网络安全公司排名 网络信息安全有哪些 龙岗营销网站建设 第三方人员 信息安全 北京高端网站定制公司哪家好 网站与微信 2014广西信息技术与信息安全 政府系统信息安全检查指 武汉 大型 网站建设 景县网站建设 考研网络营销 邢台网站建设服务周到 微博营销是 上海营销型网站制作 营销型商城 信息安全分类 怎样建设网站 亚太网络安全 郑州网络营销外包公司 网站建设公司广告 珠海企业网站制作费用 广东米酒营销 邢台网站建设服务周到 信息安全技术心得,-1 优优营销软件 网络安全课程表网络安全入侵步骤 无锡手机网站制作费用 建网站 广州 大学生信息安全 搜索营销公司怎么样 中国信息安全测评师 深圳营销型网站公司 北京高端网站定制公司哪家好 门户网站的建设 饥饿营销具体意思 宿州网站制作 网络安全隐私泄露 服装营销学百度云 莱山网站建设 郑州网络营销外包公司 深圳企业建网站公司 网站与微信 网络营销策略翻译 太原seo网站建设 信息安全高级专员 苏州高端网站建设 亚太网络安全 大学生信息安全 信息安全考试 网站是什么 网络营销资源合作 南昌网站开发 博客营销 blog 汽车的信息安全指哪些 南昌网站开发 太原seo网站建设 先知网络安全 西安专业网站建设服务 教育信息安全平台 信息安全顾问项目,-1 免费建立网站 京东网络营销特点 营销导向企业网站策划 青岛找网站建设公司好信息安全岗位招聘 信息安全风险评估弱点 服装营销学百度云 营销的基本流程 网络信息安全检查 我眼中的营销 信息安全法律研究中心 信息安全等保彩页 内部局域网的网络安全 吴世忠 以色列信息安全 香港网站建设 第三方人员 信息安全 郑州营销网站托管公司 深圳做网站 idc机房信息安全 考研网络营销 杭州 信息安全厂商 概括 病毒营销特点 房山网络安全小镇 网络营销效果评价指标体系 开网站成本 上海信息安全???生招聘 营销广告的表现形式 开网站成本 2016信息安全报告 互联网信息安全案例分析 山东省信息安全等级 数字营销与网络营销 网络营销策划推广方案 厦门网站开发建设 济南网站建设和维护 网站和后台 营销策划和销售的区别 企业网络合作营销案例 网站建设公司广告 网站都需要续费 交易营销的例子 公安网络安全技术专业 潍坊营销合作 网络营销策略的缺点 和营销下载 门户网站的建设 手机网站建设动态 烟台网站建设 汽车的信息安全指哪些 问答营销的策划 互联网营销领域的公司 香港网站建设 北京做信息安全 为什么有些网站搭建的是php其所有网页均已.htm命名 微信网页版信息安全吗 互联网营销领域的公司 在网站上显示地图 沪江网络营销 郑州网站建设怎样 在网站上显示地图 微信运营营销的区别是什么 网络营销资源合作 常用的网络安全工具 2016信息安全报告 景县网站建设 2014中国网络安全大会 信息安全分类 中国移动网络信息安全,-1 天津市信息安全测评中心 可信赖的响应式网站 中国信息安全等级 转化率营销 新乡网站优化 信息安全电脑推荐 互联网信息安全案例分析 信息安全等保三级标准 网络安全训练 湛江有哪些网站建设公司 spark 信息安全 信息安全法律研究中心 美国cnci网络安全分析解读 网络信息安全协会 太原seo网站建设 手机网站建设动态 优优营销软件 手机介绍网站 什么营销是通过微博 微博营销是 广东米酒营销 营销策划和销售的区别 外贸营销体系 计算机网络安全心得体会 网络信息安全协会 网站的结构 一、一个甜品网站建设目标 微信运营营销的区别是什么 为什么有些网站搭建的是php其所有网页均已.htm命名 广东米酒营销 内部局域网的网络安全 成都商城营销推广软件 建网站 广州 网络安全部署方案 考研网络营销 免费建立网站 互联网营销领域的公司 搜索营销公司怎么样 网络营销资源合作 全网营销方案及布局 信息安全考试 网站是什么 网络安全面临的威胁 ppt 广东米酒营销 我眼中的营销 信息安全常见的漏洞有 服装营销学百度云 网络安全网络信息安全 2014广西信息技术与信息安全 政府系统信息安全检查指 西安专业网站建设服务 网络安全隐私泄露 无锡手机网站制作费用 网站宽屏 信息安全分类 武汉 大型 网站建设 万户网站制作 手机介绍网站 网络信息安全技术下载 互联网营销领域的公司 天津信息安全测评中心 外贸营销师 互联网信息安全案例分析 房山网络安全小镇 和营销下载