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
徐州网站制作2015年关于网络安全的案例模板网站有什么不好网络营销不包括哪些网络安全密钥 surface营销型网站设计招聘网络信息安全 杂志网站建设三合一网络安全与信息安全的关系中央企业信息安全网络信息安全保护小组原本是各个不同世界和地方的九位勇士,却因一次的使命而是他们走到了一起;今后的路,虽然漫长而艰巨,但他们之间的友谊与羁绊却不会因为任何原因而被斩断,不论在何方,都会把彼此深深地记在心里!!一个理科大学生意外灵魂穿越来到异界大陆,重生在战场之中。这是一个以玄气修炼为尊的玄之大陆,他历经磨难却百折不挠,从小小的玄者到一方霸主的玄王,他的每一步都异常的艰险,精彩人生,从穿越异界开始。人只有在失去时,才懂得珍惜。 前世萧辰因为沉迷赌博,导致家破人亡,妻子自杀,女儿走丢。 等到再找到女儿时,已经是一具冰冷的尸体。 “她本来可以不死的……但她一个人长大真的太不容易了,16岁便患了肾衰竭,她需要换一颗肾,只有你可以救他,但常年酗酒你的肾早就坏了,救不了她!” “她现在才18岁,还没交个男朋友……为什么先死的不是你!” 在好友的痛斥中,萧辰悲痛欲绝,昏死过去。 还好上天给了萧辰一个重来的机会。 当他再度睁开眼睛时,竟然发现自己穿越回了妻子自杀的前一天。 于是他决定洗心革面,用一生的时间来弥补自己前世的过错,让自己老婆和女儿过上最好最幸福的生活。呐,说话要讲证据! 我区区一个宗门杂役,怎么会是全能大师呢? 还有,我只是武气六段的菜鸡,怎么可能把师兄指点成首席弟子呢? 至于那些神兽、武皇、魔教……都听命于我?我不是我没有别瞎说。 最过分的是,我一个怂包,你们竟然怀疑第一美女师姐喜欢我? 好吧,就算这些都是真的,难道我想当一条咸鱼也有错吗?天有六冠:九天、海龙、风灵、樱雪、生命、炽焰!斗界的假面骑士强袭,storm要斗破苍穹,这是一个魔法和斗气的疯狂世界啊。肖诺这个假面骑士强袭有个凶猛系统啊。 这真不是假面骑士,而是一个披着假面骑士storm皮肤的家伙在斗界里疯狂的强袭饶命。斗界世界,宇宙大地,恶魔果实,应有尽有“这是哪?我不是在家么?刚才好像地震了,我好像被压死了……那我就好好再活一世吧!”叶岚想着,时间已经过去了许久。 “首先可以排除这里是仙侠世界,因为按照常规的话,仙侠小说一般都是古代!也不是末世,所以说……难不成是奥特世界么?但是我还是需要再想一想才好!”叶岚可是博士生,思考能力可不弱! “那我最近去一趟商场吧!那里应该有新闻!” 第二天…… “因帕克危机?难不成……捷德?那我肯定在奥特世界了!不然不可能没人管贝利亚!” “诶!兄弟!还什么因帕克危机,贝利亚,肯定是假的!这图片肯定是伪造的,对吧?”一个男子碰了碰他,笑着说。 “我觉得很有可能是真的!”叶岚边想边说。 (叶岚内心:我?不是碍于颜面就说这里有奥特曼了!) “诶?为什么?”那个男子问他到 “因帕克危机是由于一颗导弹而发生的!从图片里仔细观察就能看出!只要有怪兽,就一定会有奥特曼的!这是以前的事情,但是隔了几年了,可能也会出现怪兽了!”叶岚朝他道。 神明大战,全球穿越,觉醒天赋! 江白开局觉醒神级天赋——万能吞噬! 他可以吞噬一切力量! 捡起地上石子吞噬,获得天赋肉身石化! 吞噬植物,掌控森林之力! 吞噬魔兽,掌控魔兽血脉之力! 吞噬敌人,掌控对方所有战斗技能和天赋! 看江白如何猥琐发育,逐渐无敌于天下。民间故事诡异,喜欢听民间故事的关注我冬天里为超自然EF研究院成员,每日的工作便是解决世面上出现的超自然现象...   再执行任务期间,他所要面对的全部都是一些未知的生物以及诡异灵能事件。
服务营销优缺点 网络营销体现什么营销理念 徐州网站制作 合肥网站建设 网站制作 杭州公司 信息安全 2017 案例营销 珠海微信营销推广 网络营销ftp服务 外贸网站建设公司咨询 感情纠纷的案例分享咨询【www.richdady.cn】 婴灵的化解方法【www.richdady.cn】 特殊学校的前世因果咨询【www.richdady.cn】 家庭关系咨询【www.richdady.cn】 与公婆前世的前世缘分【www.richdady.cn】 阴间生活的前世修行咨询【σσЗ8З55О88О√转ihbwel 头脑混沌的前世因果咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 公司破产的原因分析【σσЗ8З55О88О√转ihbwel 什么是婴灵?咨询【企鹅383550880】√转ihbwel 工作升迁的障碍与突破【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 通灵与心理学结合咨询咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 什么原因意外咨询【www.richdady.cn】√转ihbwel 家宅磁场干扰的原因【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 财运不佳的财富积累方法有哪些?咨询【微:qq383550880 】√转ihbwel 心慌胸闷头晕的自我提升咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 心慌胸闷头晕的案例分享咨询【www.richdady.cn】√转ihbwel 缺心眼的前世因果咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 与男友前世的前世修行威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 去世的母亲的前世记忆威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 脑部不清晰的前世因果【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 2015年关于网络安全的案例 如何成为网络营销师 网络营销的实施方法 网络营销app 2014年信息安全培训,-1 飞鱼星 网络安全 网络营销不包括哪些 外贸网站建设公司咨询 河南省信息安全 电视整合营销 网络安全技术及成果 网站css中父级自适应高度没有子级自适应的高度高怎么解决 网络安全咨询公司 厦门企业官方网站建设 网络营销ftp服务 2015年关于网络安全的案例 网络安全密钥 surface 网络安全与信息安全的关系 信息安全建设依据 深圳教育平台网站建设 教育市场营销策划方案 公司营销网站建设 网络安全咨询公司 学院网站规划方案 网站设计行业资讯 网络营销的swot 重庆网络营销哪家专业 耐克专场营销案例 如何成为网络营销师 怎么做网站排版 网站说服力 通州顺德网站建设 分析企业网络营销环境分析 新媒体营销效果 网络安全技术与应用 级别 公司营销网站建设 乐清网站推广公司 信息安全的感谢 电子邮件营销含义 网络及信息安全 铁通 答案 网站制作字体 网络营销渠道策略有 徐州网站制作 广州外贸网站建设 周口网站建设 信息安全服务资质证书 级别 信息安全 科普 网络和信息安全专业 企业网站优化 网站建设seo优化公司 服务营销优缺点 信息安全服务资质未通过 耐克专场营销案例 网站的标准 宜昌网站制作 做网站北京 国家信息安全与战略 网站大小 美国网络安全标准体系 信息安全专业规范 信息安全 2017 飞鱼星 网络安全 绵阳市公司网站建设 网站设计分析 曲靖网站建设 电视整合营销 网络营销渠道成本 企业网站优化 网络营销ftp服务 佛山外贸网站建设方案 搜索引擎营销的流程 信息安全大赛比什么 网络通信与信息安全 信息安全攻击 网络安全方法 东阳网站建设 网站设计分析 珠海微信营销推广 重庆整合营销多少钱国家计算机网络与信息安全管理办公室 分析企业网络营销环境分析 网络安全资产管理制度 建立网站的费用 网站制作 杭州公司 网络营销效果评价指标 2015年关于网络安全的案例 网络安全资产管理制度 工信部信息安全中心 网络安全是啥 篇高端网站愿建设 信息安全竞赛软件,-1 社会媒体营销的方法 搜索引擎营销的流程 网络安全训练营自做网站 信息与网络安全杂志 高端广告公司网站建设 政府 网络安全方案 营销包含哪些 网络与信息安全会议,-1 企业内部信息安全平台,-1 合肥网站建设 中国信息安全认证中心 主任 微信群营销推广方案 外贸网站建设公司咨询 重庆网络营销哪家专业 信息安全专业规范 政府网站怎么管理系统 政府 网络安全方案 时效营销 搜索营销公司 网络安全要有什么基础知识 建和做网站 网络安全审计原理 群营销好处 网站构造 信息安全的保护技术 南通网站制作 营销发展史 网络营销app 信息安全管理理论 网络营销渠道成本 飞鱼星 网络安全 网络与信息安全方向 培养计划 集团公司网站方案 外贸网站建设公司咨询 酒泉网站建设 社会媒体营销的方法 电视整合营销 深圳全网营销 网站设计行业资讯 网站css中父级自适应高度没有子级自适应的高度高怎么解决 微信群营销推广方案 群营销好处 厦门企业官方网站建设 大学网络安全专业 云南信息安全测评中心