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
盐山做网站苏州信息安全等级保护北京 网站建设舆情营销什么是信息安全事态p2p网站建设公用网络安全审计网络信息安全公告网络营销实战课程下载营销人优点一个小朋友气恼祖先不争气,于是派了粉红小猪回到过去帮助祖先,没想到……福无双至祸不单行。法洛斯大陆先失去了日月陷入永夜,随后势不可挡的冰魔大军又渡海而来毁灭了大陆诸国,奴役了人类一百年。 百年后,一位神秘的青年用火焰魔法驱逐了冰魔,自身化作新的太阳照耀大陆,被人类尊为火神。 但火神未能带来真正的和平。各类魔物仍不断接踵而来,新生的人类帝国培养了有着超人体能、感官的猎魔士。 作为新晋猎魔士的男主角李奥,因解救了在打猎时遭到魔物袭击的皇帝,被皇帝提拔为贴身侍卫。可之后不久,皇帝遇刺亡,公主遭到绑架,李奥被当成了凶手。 在为自己洗刷冤屈的过程中,李奥发现了猎魔士的起源,却也因此使猎魔士和人类对立起来,直至爆发内战。 对人类失望的火神再次现世,企图毁灭一切。在李奥爆发出自身隐藏的未知力量后,火神和战争被阻止了。李奥也为了调查太阳消失的真相,踏上了在穿越世界的旅行…… 高阳原本是个蓝星的雇佣兵,在一次执行任务中来到了金庸武侠世界--神雕。 在神雕世界中获得武林中人梦寐以求的武林秘籍,左手六脉神剑、右手降龙十八掌,年纪轻轻就达到别人一辈子的成就, 一个小小的蝴蝶能带动多大的效应?神雕世界因为高阳的到来又会有什么样的变化?神雕中的爱恨情况是否因为高阳的到来而改变? 让我们走进神雕世界,看高阳如何在江湖中翻云覆雨~~~~~ 各位书友要是觉得《神雕之我是大魔王》还不错的话请不要忘记向您的朋友推荐哦我们永远停留在这片土地上,和星辰同住,日月同眠,我们永远在一起。 女大学生李予和舍友共四人结伴毕业旅行,途中遇到身为警察的周自野执行抓捕携带病毒的犯人。 谁料犯人临时改变路线,上了火车后才发现原来犯人就是病毒本身,变异丧尸后李予和宿舍四人各怀本领和周自野共同抵抗,对抗途中,宿舍女生带的东西个个奇葩,招招试试的运用当代女大学生的智慧对抗变异丧尸。此时,火车广播信号中断,突如其来的神秘人控制了火车,改变路线,尸潮来袭!是早有预谋的计划!原来在整车人上车前就已感染病毒,他们是要整车的人试验品陪葬!穷途末路时的最后奋死抵抗,火车最终开向灭亡,开向绿野,春风里去地球的倾斜角度是23.5度,如果南北半球角度互换会怎样?一颗陨石做到了,世界将会怎样? 我是一个孩他爹,没能保住他娘,我得保住他,我可就这么一个猴崽子! 活着不容易,想死却更难......死可能是一种解脱,但我还有一个不能死的猴崽子!一个退伍的特种兵生意正做得红火的时候,一场流行病袭来死在重病房,穿越到宝玉身上。但是这个宝玉却是在实实在在的清朝康熙初年,且看他如何玩转贾府,如何与黛玉、宝钗发生最让人惊叹的爱情;如何与秦淮八艳共进退;如何揭开康熙的神秘身份,如何解开清朝最大秘辛,如何成为最大的“造反大头目”,最后黄袍加身,成为新的“大汉国”开国“总统帅”!生如蝼蚁当有鸿鹄之志,命薄似纸应有不屈之心! 大商末年,天下大乱,群雄逐鹿。 一代天骄叶青林横空出世,平四方,定天下,统一乱局,建立了不朽王朝——大屹帝国。 数十年后,江湖上风云再起,朝堂中波诡云谲。 一个偏远小镇走出来的少年,谱写了一段可歌可泣的传奇故事。天道陨落,生命祭献,少年轮回,叙写传奇。且看,无双天骄,翻手天初,覆手天末,天临世间!一个现代年轻人穿越到其他游戏里的故事(会对游戏进行一些更改)(作者学生随缘更新)[拔刀术。] [你手中的长刀有一米四的长度,十二点钟方向位,一米五的距离,一名法师角色正要对你发起攻击,请问你要如何在三秒钟拔出长刀,并将长刀架在敌人的脖子上?是否要抽刀进攻?] 景若如皱着眉仔细想了想,随后在答案上写道: “首先不能抽刀。刀鞘的摩擦会使拔刀的速度变慢。” “解:首先,左手现将刀鞘下压,右手以倾斜的角度握住刀把,再使大拇指对刀柄施加‘力’,右手握住刀把下拉,借助自己手上所施加的力与刀鞘口对着下方的力,长刀会快速出鞘。这里以普通人的速度大概是两秒左右。” “接着,将刚出鞘的长刀旋转,画出一个半圆,就能完美抵到那名法师的脖颈上。这个动作最多一秒。” 写完,景若如有些感叹,“这道题算得上是有些难度。” 看向下一题。 [伤口考验。] [如果你的长刀刺进了敌人的身体,但无法破防,你下一步最准确的做法应该是什么才能使敌人最大程度的受伤?] 景若如双眼一亮,送分题。
佛山营销型网站建设公司 公司网站被侵权 手机版网站设计风格 大连公共信息网络安全监察局 桂林网站建设哪家好 事件营销的特点有 网络安全 四层 深圳市网络安全公司 网络安全技术包括什么 系统之间的网络安全 如何改善财运不佳的情况?【www.richdady.cn】 心特别累的咨询技巧咨询【www.richdady.cn】 为什么过世的前世修行【www.richdady.cn】 莫名其妙感伤的前世影响咨询【www.richdady.cn】 事业不顺的职场瓶颈如何突破?咨询【www.richdady.cn】 什么原因意外的前世案例咨询威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 前世老婆的咨询技巧【www.richdady.cn】√转ihbwel 迟缓儿的自我提升咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 儿子抑郁症的自我提升【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 婴灵、邪灵、祖灵咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 工作压力大导致的精神不振【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 外灵干扰的原因分析威:⒊⒏⒊⒌⒌O⒏⒏O√转ihbwel 儿子不读书的环境影响咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 人际关系不好的表现及原因咨询【微:qq383550880 】√转ihbwel 意外的前世解析咨询【微:qq383550880 】√转ihbwel 意外的前世记忆咨询【Q⒊⒏⒊⒌⒌O⒏⒏O】√转ihbwel 有官司的调解技巧【www.richdady.cn】√转ihbwel 大龄剩女的案例分享咨询【企鹅383550880】√转ihbwel 忧郁症的预防措施咨询【企鹅383550880】√转ihbwel 解梦的案例分享咨询【σσЗ8З55О88О√转ihbwel 经典微信营销软文 北京网络营销公司 湛江有那些网站制作公司 公司网站被侵权 网站jianshe 网络信息安全中宣部 深圳市网络安全公司 怎么弄一个网站 公安网络安全监察 网络安全 四层 西安网站架设公司 信息安全分保内容 信息安全分保内容 有站点营销 邢台做网站可信赖 基于大数据的网络安全 桂林网站建设哪家好 佛山营销型网站建设公司 2016年网络安全现状分析 营销的特性 对网络营销课程的认识 网络安全前景2017 2016 网络安全事件网站的颜色 全网营销的主流模式 营销有哪些渠道 信息安全文章 网络安全审计联通 舆情营销 汽车有哪些信息安全 网络安全基础知识 淘宝网营销 拖拽网站 系统之间的网络安全 信息安全 自有 淘宝店铺线上营销信息安全 体系 网络安全缘起 衡水企业做网站 网络安全信息法 武汉信息安全网org,-1 北京 网站建设 网络安全技术入门 美国网络信息安全 网站创建流程教程 顺德新网站建设 自己怎样制作公司网站 营销概念是什么意思 网络营销实战课程下载 网络营销针对哪些人群 网络安全技术包括什么 汽车有哪些信息安全 我们国家网络安全吗 北京网络营销公司 什么是信息安全事态 第二届国家网络安全宣传周主题 公用网络安全审计 做网站讯息 佛山做网站 怎么免费把自己在dreamweaver做的网站放到网上去 盐山做网站 苏州信息安全等级保护 怎么免费把自己在dreamweaver做的网站放到网上去 我们国家网络安全吗 品牌营销 大数据网络安全测试题 大连公共信息网络安全监察局 微博营销是指什么 网络安全新闻信息 网络信息安全中宣部 莱芜网站制作 网络安全 四层 信息安全保障体系 网站与后台 朝阳区网络安全中心 网站建设流程 张家港早晨网站制作 国家网络安全小组 网络营销淘宝达内培训 营销机构SEO 网站设计小技巧 绿色风格的网站 网络安全培训方案 瑞星:2013年上半年中国信息安全综合报告 网络信息安全攻防赛 email 营销 有关网络安全电影 网络营销针对哪些人群 佛山做网站 网络信息安全中宣部 石家庄做网站建设的公司排名 有关网络安全电影 宁夏网站设计在哪里 北京 网站建设 网络营销运营部 宁夏网站设计在哪里 网络与信息安全 网络信息安全面临的威胁 计算机信息安全等级划分准则,-1 营销的误点 广西网络信息安全峰会 公用网络安全审计 深圳专业网站制作公司排名 2015信息安全大会 营销唐玮 关注网络安全bolg 深圳市网络安全公司 全网营销的主流模式 国家242信息安全计划 信息安全 自有 高校网络安全采访问题 深圳 信息安全培训课程长安网站建设 信息安全 自有 张长河 网络安全 信息安全文章 2016年网络安全现状分析 视频营销的优点 事件营销的特点有 拖拽网站 怎么弄一个网站 网站价格表 兴化网站制作 软营销案例 衡水企业做网站 企业网站seo 提供做网站企业 网络安全培训方案 佛山营销型网站建设公司 桂林网站建设哪家好 专业信息安全服务资质咨询公司,-1 email 营销 校园网站怎么建 网站信息安全评估报告 网站搭建公司官网 信息安全培训专业 舆情营销 网站建设流程 gb/t 20984-2007 信息安全技术 信息安全风险评估规范 丹江口网站开发