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网络安全峰会信息安全专题宣贯手册上海营销型网站湖南高端网站制网络安全认证个人网站在那建设网络营销的创新方法设计网站多少钱重庆全网营销协会深圳信息安全企业,-1十万年前万族入侵人族,昊天大域一位名叫玄武的武道俢士为了人族,强行突破武帝之境,万族却派出十名帝者对其围杀,谁承想十名帝者全部陨落,此战过后万族震动,至此万族不敢踏入人族领域半步,从此被天下誉为玄武帝尊…………… 十万年后人族武者再无一人突破到武帝,武道凋落。至此佛教、道教、魔教纷纷崛起,在这个神、佛、仙、魔的世界里,一位重生之人携金书闯入……………他喝了一大口酒,眼睛看着那些画板,有的是女孩坐在草地上,有的是女孩坐吃苹果,有的是女孩做鬼脸,有的是女孩钻在桌子底下,有的是女孩在海边沙滩上走,有的是女孩在看书,有的是女孩在堆石头,有的是女孩在吹肥皂泡,有的是女孩在海边堆沙堡。 到处都是同一个女孩的头像,到处都是他无处不在的思念,和他曾经毫不吝啬的青春。她用眼睛一张一张的端详起这些画作,每一幅画作虽然很唯美,却都散发出悲伤的气息,仿佛充满了痛苦而挣扎的记忆,她轻轻地问,你为什么你不去找她? 他的眼睛里闪过一丝痛楚,我的世界在这里,离开了我的画室我就不再是我自己了。 她问,既然你这么想念她,难道不能将你的画室带到有她在的地方吗? 他的表情显得忧伤而决绝,我必须远离喧嚣,有如一座寂静的庙宇,我需要用有限的生命去创造永恒。 他问,你呢,为什么来到这里,为什么那么伤心。 她本来不是一个喜欢说话的人,也不喜欢轻易坦露自己的心事。但是这次她说,我总是这样。 江湖风云出我辈,一入江湖岁月催,皇图霸业谈笑中,不胜人生一场醉。古陵穿越仙武世界,成为道宗被废弟子。被打入禁地渊薮,觉醒签到系统。 “叮!签到成功,恭喜宿主获得先天圣体道胎!” “叮!签到成功,恭喜宿主获得元辰精神术!” 一百年后,修行界大乱,在古陵走出禁地的时候,豁然发现,自己举世无敌。本书一切内容纯属虚构,剧情以小说世界观为准,设定和现实世界有一定差异性。 这是一部战争向的科幻作品,这里描绘了人类的发展历程。 在黑暗的星空之中,在利益与道德之间,人类该作何选择? 面对比自己弱小的原始文明,亦或是强大的奇迹文明。 加入,守护,掠夺,进攻。 联合舰队,启航! 鸽子进化成不那么鸽的鸽子了!尽量一天一更。 本书是原创世界观,世界观很庞大所以需要大量时间来概述。 这本书讲的不是一个人,而是一个世界。主角楚墨,婚礼时,被兄弟当场绿了,因气不过,直接冲出婚礼现场,可突然,一辆小车冲来,死了……作为一个男人,没有勇进之心等于平庸。 一个事物或情感的拿起或放下,需要勇气和魄力。 肃清心灵迎接晨光,让我们一起感受生活乐趣。在这个世界里,跨界石,是一种神奇的东西。相传上古时期,轩辕姬得之,拥有掌控南北两极之能,所以控磁场,造司南。大禹得之,拥有排山倒海之势,所以治江海。? ?...... 而觉醒职业和灵器,是这里每人都渴望的事。 雪擎,一个被祝福和诅咒同时缠上的少年,即将开启一段传奇之旅...... ?”喂喂,系统你别着急休眠呀,留我一个人要是挂掉怎么办啊!“ 不靠谱的系统和一位少年郎的梦幻组合,将会为异界带来怎样的波澜呢? (同人文,原著《史上第一祖师爷》,作者八月飞鹰。)全民领主时代,每人开局一个领地招募兵种,发展资源。 王晨觉醒神级天赋不但拥有无限升级,而且还能百倍增幅。 7000级的亡灵骑士,一人就可覆灭一地。 面对5000级的枯骨亡灵,巨龙领主也只能成为坐骑。 当百万级的堕落使者,地狱三头犬,恐怖幽灵出没,世间所有领主臣服。
大学生网络信息安全大赛比什么 网络安全用户信息包括 大学生网络信息安全大赛比什么 企业网络营销总裁培训班 独特网站的 天津微信网站建设 网络安全行业企业50强 优设网站世界网络安全500强 网站建设 长春 病毒营销的发展趋势 亲子关系的问题分析咨询【www.richdady.cn】 不爱读书的心理调适【www.richdady.cn】 前世今生查询服务咨询【www.richdady.cn】 自闭症的咨询技巧咨询【www.richdady.cn】 大龄剩女的案例分享【www.richdady.cn】 心特别累的原因分析威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 感情纠纷威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 去世的母亲的前世缘分咨询【微:qq383550880 】√转ihbwel 投资项目的收益分析咨询【企鹅383550880】√转ihbwel 去世的父亲的前世缘分【σσЗ8З55О88О√转ihbwel 婴灵对家庭关系有哪些影响?【σσЗ8З55О88О√转ihbwel 前世今生的轮回真相咨询【企鹅383550880】√转ihbwel 前世老婆的前世修行咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 精神不振的案例分享咨询【微:qq383550880 】√转ihbwel 与老公前世的前世修行【微:qq383550880 】√转ihbwel 事业不顺的职场突破【微:qq383550880 】√转ihbwel 儿子不读书的前世记忆咨询【σσЗ8З55О88О√转ihbwel 存不住钱的心理调适【σσЗ8З55О88О√转ihbwel 升迁障碍的职场建议【企鹅383550880】√转ihbwel 前世今生的轮回真相【www.richdady.cn】√转ihbwel 营销培训课程费用 12306信息安全事件追寻,-1 大网站成本 番禺网站推广公司 美国网络安全产业 网络营销在我国的发展现状 哈工大信息安全854复试 天津微信网站建设 内容营销与传统营销的区别吗 16达内网络营销盘 云南网络营销 洛阳网站seo 湖北信息安全网络技术 哈工大信息安全854复试 网络黄页营销 互联网信息安全办公室 网络安全教育培训 手机网站开发教程 网络与信息安全要求 病毒营销优缺点 airbnb营销模式整合网络营销案例 北京做网站公司 网络与信息安全要求 什么是信息安全工程 网络营销在我国的发展现状 qq绑定手机号银行信息安全吗 绵阳汽车网站制作 莱州网站建设顺义广州网站建设 网络安全产品有哪些 河北seo优化_网络建设营销_网站推广服务 - 河北邢台seo 餐饮互联网营销 案例 网络营销特色化描述 什么叫网络营销 微博新号营销 山西信息安全技能大赛 西安网站 好模版网站 网站建设申请 网络营销的5种类型 营销网站的筛选 国家信息安全漏洞 网络安全 端口 网络安全漏洞的分类 设计网站多少钱 绵阳汽车网站制作 2016年网络安全年会 教育式营销 个人网站在那建设 有关营销的公众号名称 杭州 网络安全公司 公司信息安全系统包括 b北京网站建设 天津微信网站建设 网站特效 信息安全专题宣贯手册 网络营销推广怎么做 云南网络营销 聊城网站设计网络安全等级保护版本 国家有网络安全制度吗 有设计感的网站 考网络安全什么证书 烟台网站建设联系电话 国家信息安全漏洞 整合营销运营 企业网络营销总裁培训班 广州网络安全学校 山西信息安全技能大赛 网络能力营销秀 网络安全 端口 机房信息安全评估报告 有关营销的公众号名称 中国网络安全产业大会 b北京网站建设 网络安全教育培训 营销的闭环 西丽网站设计 什么是信息安全工程 网络安全命令大全 扣扣营销 信息安全公司资质证书,-1 营销培训课程费用 西丽网站设计 信息安全管理规范立项 企业网络营销总裁培训班 国家网络安全周主题 网络安全攻击例子 企业网络营销总裁培训班 中山网站建设文化策划书 网络营销在我国的发展现状 罗湖高端网站设计 汽车网站模板 网站特效 优设网站世界网络安全500强 国家有网络安全制度吗 b北京网站建设 湖南专业做网站企业 营销课程图片 网络安全行业企业50强 杭州 网络安全公司 烟台网站建设联系电话 网络能力营销秀 it信息安全 河北seo优化_网络建设营销_网站推广服务 - 河北邢台seo 两会 网络安全法 湖北信息安全网络技术 哈工大信息安全854复试 内容营销与传统营销的区别在哪里 传统营销和内容营销 工作室网站模板 整合营销运营 2017网络安全热点事件 信息安全 it风险评估 互联网金融与信息安全 龙口建网站 餐饮互联网营销 案例 腾讯的网络营销 罗湖高端网站设计 上海营销型网站 云南网络营销 网络安全用户信息包括 网络安全 端口 云南网络营销 信息安全 it风险评估 营销的闭环 b北京网站建设 信息安全公司资质证书,-1 机房信息安全评估报告 国家注册信息安全咨询师国家网络安全周主题 信息安全公司资质证书,-1 营销网站的筛选 信息安全方案 互联网金融与信息安全 网站免费认证 营销e术 基于区块链的信息安全,-1