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
耒阳做网站计算机网络信息安全证蘑菇街网络营销2017国际网络安全网络安全企业 深圳开放网络安全吗网站建设公司倒闭网络信息安全创新创业大赛熟人关系营销全国公安机关网络安全保卫工作会议 神魔横行,仙尊镇世!地星,是一个仙道大昌之地!然修行者只为一己私欲,破碎山河,湮灭了这繁盛的修仙界! 天道伤隐,灵气绝迹,地星进入了漫长的枯寂岁月! 数十亿年后,外太空超新星爆发,突然而至的神秘物质,引出了地星久违的天道,灵气出,武(仙)道现。 杨东望,一名普通的大学副教授,偶得上一个纪元遗存的造化法宝玄天塔残骸,在灵气新生时就占据先手,并利用小宝塔中的残破记忆,逐步引导武(仙)道进入、改变了科技社会的方方面面,从而开启地星科武新纪元。 一个小和尚,穿越到了异世界大陆,面对公主和女皇的挽留,他就只想着回家? 江城穿越平行世界,绑定神级科技系统,系统的触发条件是让他独自研发一项改变世界的发明。 于是他选择了可回收火箭,打造猎鹰九号升级版,在苦心研究五年之后,所有测试结果均为完美,成功率百分之九十五,一经上市,保守年收入五十亿。 为了拿到投资,他将自己的所有理念模型,包括他获得的荣誉电邮到了摩根银行,竟然真的得到了回信,并且对方愿意前来核验。 恰逢相亲走错桌,遇到年轻貌美的投行女大佬,没想到摩根银行的投资条件是让这项技术为M国专利,江城愤然拒绝。 摩根银行为此和媒体恶意渲染抹黑回收火箭技术不可能实现,想要毁掉江城。 关键时刻,看到一切的相亲女大佬林若溪在媒体面前支持江城,并且怒投十亿! 三个月后,当猎鹰九号升级版问世登上太空,并且成功返回之后,全世界都震惊了!王朝的覆灭,流于乱世的权贵,一柄赤霄、一柄黑夜,一壶烈酒,走过山川异域,看过云卷云舒,品过人生百味,方知年少追寻之江湖,不过老来葬身之庙堂,江湖风雨,庙堂私语,终究比不过那江湖沙场,庙堂知己啊!风声、雨声、读书声、终究比不过那沙场的马蹄声啊!功名、烟火、财富,终究比不过那江湖之风流啊!江湖儿郎江湖死,庙堂书生庙堂语。赤霄、黑夜,一刀一剑,便将这江湖捅个底朝天,将这庙堂搅个天翻地覆;且看,司马枫与纳兰明轩快意平江湖;共同入庙堂;携手赴沙场……我叫牧冬,我的世界存在着一种名叫天劫的怪物,幸好,与此同时,有一群正义的超级英雄们挺身而出,与之对抗...... 直到那天,这个游戏出了BUG,不再自动刷新和删除记忆。这个星球上,上古最强之族,炎魔一族因修炼一本神级功法《太灭》而没落,由于曾经过于强大,导致曾经在他们之下的人使炎魔后代为奴,千年来一直如此,直到炎魔学院的两名少年显露头角,这是一个大变局时代,由众人谱写,两位少年同当世各方豪强将会展开怎么样的争霸呢?在传说里,魂灵大陆百万年将发生一次让万物生灵毁灭的大灾难,同时也会降生一位灵裔,他将引领魂灵大陆共同面对这可怕的灾难。千万年来,人灵两族互相争端不断,直至虚空裂缝的出现,两族在与虚空种族的对抗中死伤无数,面对着逐渐被侵占的家园,人灵两族在灵裔余莫的带领下,决定放下一切仇恨,共同合力毁灭虚空裂缝。侠,以武犯禁。 魔,以欲乱世。 当一个力量与技巧都达到极致的存在出现在这个世界上时是怎样的体验? 这是一个杀戮机器逐渐成长为人的故事....一条深沟,尽隔战乱与诸侯;一片雾海,皆折豪雄与勇谋。我们看不到希望,我们看的到希望。寂灭深处,尽头才是新春秋。 “所以我相信,复仇也许并不会带来真正的胜利,但是如果我不做出努力,我不为了这个目标而奋斗,那么未来将对我更坏,在有实力的前提下我可以饶了过去的邪恶,但咱那之前又有谁能够饶了我?”仙路诡奇,人道卑微。 众生皆浮屠,仙心如寒霜。 少年方尘意外获得仙缘,心中却只有一愿:愿以手中仙剑,开万世太平!
广东汽车品牌网站建设 信息安全不猛第四届网络安全 内网网络安全 信息网络安全技术培训 个人手机版网站建设 javascript 识别手机并跳转到手机网站 并可回到电脑版 哪个网站是专门为建设方服务的 潍坊网站优化 网络安全竟赛 乌克兰事件 信息安全 与女友前世的前世缘分咨询【www.richdady.cn】 冤亲债主干扰【www.richdady.cn】 婚姻生活不顺的沟通技巧咨询【www.richdady.cn】 升迁障碍的改运方法【www.richdady.cn】 失业的职业规划【www.richdady.cn】 家庭关系的情感维护方法有哪些?咨询【www.richdady.cn】√转ihbwel 发育倒退的前世记忆【σσЗ8З55О88О√转ihbwel 性压抑的前世记忆咨询【企鹅383550880】√转ihbwel 心慌胸闷头晕的心理调适【σσЗ8З55О88О√转ihbwel 与公婆前世的影响分析咨询【σσЗ8З55О88О√转ihbwel 前世老公的前世修行威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 事业不顺的职场心态咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 冤亲债主干扰的解决方法【微:qq383550880 】√转ihbwel 去世的父亲的前世缘分【σσЗ8З55О88О√转ihbwel 如何克服升迁障碍?咨询【www.richdady.cn】√转ihbwel 发育倒退的自我提升威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 内心恐惧胆怯的前世影响咨询【企鹅383550880】√转ihbwel 事业不顺的改运方法【微:qq383550880 】√转ihbwel 与老公前世【企鹅383550880】√转ihbwel 无形干扰的前世因果【σσЗ8З55О88О√转ihbwel 贵阳有哪些可以制作网站的公司 做网站 长 怎么写网络营销的总结 网络安全 加强培训 杭州 信息安全培训 宁波 做网站 智能电视信息安全 网络安全 加强培训 wifi信息安全登记平台 360网络安全团队 网络营销培训 网络安全网络空间 网络信息服务 网络安全保护 javascript 识别手机并跳转到手机网站 并可回到电脑版 网络信息安全网站 信息安全条款 网站设计建站 营销型企业网站 山东信息安全测评中心 国家网络安全专题 深圳网站营销公司 戴尔的营销理念 哈尔滨网站建设市场 信息安全不猛第四届网络安全 内蒙古网站建设 教育信息安全等级保护测评中心 云平台的运维与管理 ppt 乌克兰事件 信息安全 信息安全管理职能部门 网站设计教科书 营销培训费用 当今网络安全的四个特点 自助网站建设 单位信息安全等级保护工作部署 宁波 做网站 vpn与网络安全pdf 网络信息安全 培训 中国石油信息安全 网络信息安全交流会 互联网信息网络安全技术保护措施 有没有关于网络安全的工具 展示网站模版源码 手机网站模板 信息网络安全技术培训 自己建的网站打开的特别慢 网站优化合同 黄浦网站建设 网站模板网 xcon安全焦点信息安全技术峰会 珠海动态网站制作外包云南网站制作 中心网络安全管理办法 cisp ppt 中国信息安全测评中心 网络信息安全创新创业大赛 当今网络安全的四个特点 陕西省网络安全协会 陕西企业网站建设 成都c3网络安全 信息安全不猛第四届网络安全 设计网站app 有没有关于网络安全的工具 合肥赢点网络营销策划有限责任公司 电子邮件营销作用 熟人关系营销 一键营销 信息安全不猛第四届网络安全 互联网营销运作 2012年中国互联网网络安全态势报告 网络安全实验总结 wifi信息安全登记平台 asp网站运行时浏览器兼容模式为什么显示不了商品图片?极速模式可以 黄骅的网站 2017国内网络安全公司 网站方案怎么写 企业网络安全学校 做网站资讯 做网站 长 2017国际网络安全 网站方案怎么写 信息安全的宗旨 互联网出口 网络安全 网站主色调 信息安全的宗旨 苏州高端网站制作 绵阳网站 城域网网络安全 中心网络安全管理办法 山西网站建设 关于网络安全的信息 成都 网站建设 东营+网站建设 网络事件营销特点 网站设计建站 网络信息安全网站 网站制作时如何分析竞争对手 天津 网站设计公司 蘑菇街网络营销 信息安全发展史 网站建设策划书ol 网络安全监测方式 我与网络安全 关于网络安全的信息 营销系统有哪些广州网站维护 香港网络安全中心 xcon安全焦点信息安全技术峰会 南天信息 信息安全 自助网站建设 有没有关于网络安全的工具 信息安全大会 上海,-1 网站优化合同 信息安全管理职能部门 宁波 做网站 哪个网站是专门为建设方服务的 自己建的网站打开的特别慢 深圳网站营销公司 电子邮件营销作用 黄骅的网站 网络信息安全网站 网络信息安全演讲 网站建设策划书ol 信息安全需要关注网站 信息安全管理协同体系 中心网络安全管理办法 网络安全攻击报告 商城网站建设 关于网络安全的信息 信息安全管理协同体系 网站模板网 绿盟信息安全科技公司 内蒙古网站建设 网站模板网 教育信息安全等级保护测评中心 云平台的运维与管理 ppt 山西网站建设 国内网络安全新闻 营销型企业网站 乌克兰事件 信息安全 网络营销策划书的撰写