1、table-striped:斑马线表格

2、table-bordered:带边框的表格

3、table-hover:鼠标悬停高亮的表格

4、table-condensed:紧凑型表格(单元格的内距由8px调至5px。)

5、table-responsive:响应式表格(当你的浏览器可视区域小于768px时,表格底部会出现水平滚动条。当你的浏览器可视区域大于768px时,表格底部水平滚动条就会消失)

6、“.table”主要有三个作用:

☑  给表格设置了margin-bottom:20px以及设置单元内距

  ☑  在thead底部设置了一个2px的浅灰实线

  ☑  每个单元格顶部设置了一个1px的浅灰实线

<table class="table">
<thead>
<tr>
<th>表格标题</th>
<th>表格标题</th>
<th>表格标题</th>
</tr>
</thead>
<tbody>
<tr>
<td>表格单元格</td>
<td>表格单元格</td>
<td>表格单元格</td>
</tr>
<tr>
<td>表格单元格</td>
<td>表格单元格</td>
<td>表格单元格</td>
</tr>
</tbody>
</table>

关于bootstrap--表格(table的各种样式)的更多相关文章

  1. __x__(40)0909第五天__表格 table 的 css 样式 美化

    如果就向下面的代码那样,不写 tbody , 则浏览器自添加 tbody , 并将所有的 tr 移入 tbody 意味着 tr 并非 table 的子元素,而是 tbody 的子元素. 所以 以后编写 ...

  2. 关于element-ui表格table设置header-cell-class-name样式不起作用的原因分析

    在编写表格的时候想给表头添加样式,使用 header-cell-class-name怎么都添加不上样式,检查元素发现连class都没添加上,查了很多资料有人说element之前版本不支持这属性,但我使 ...

  3. 表格Table好看的样式表

    caption { padding: 0 0 5px 0; width: 700px; font: italic 11px "Trebuchet MS" , Verdana, Ar ...

  4. amazeui学习笔记--css(HTML元素5)--表格Table

    amazeui学习笔记--css(HTML元素5)--表格Table 一.总结 1.基本样式:am-table:直接模块名  <table class="am-table"& ...

  5. 关于Vue.cli 脚手架环境中引入Bootstrap时,table表格样式缺失的解决办法

    Vue+bootstrap不能正常使用table的样式 环境:下载官网的本地bootstrap包,然后在vue 的index.html引入bootstrap的css和js环境 问题描述:1. vue里 ...

  6. BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  7. Bootstrap表格样式(附源码文件)--Bootstrap

    1.表格默认样式 <h4>表格默认样式</h4><table><!--默认样式--> <tr><th>序号</th> ...

  8. Bootstrap -- 表格样式、表单布局

    Bootstrap -- 表格样式.表单布局 1. 表格的一些样式 举例: <!DOCTYPE html> <html> <head> <meta http- ...

  9. bootstrap表格样式

    一:表格基本格式 <table> <tr> <th>标题一</th> <th>标题二</th> </tr> < ...

  10. jQuery 选择表格(table)里的行和列及改变简单样式

    本文只是介绍如何用jQuery语句对表格中行和列进行选择以及一些简单样式改变,希望它可以对jQuery表格处理的深层学习提供一些帮助jQuery对表格(table)的处理提供了相当强大的功能,比如说对 ...

随机推荐

  1. 你需要知道的九大排序算法【Python实现】之快速排序

    五.快速排序 基本思想:  通过一趟排序将待排序记录分割成独立的两部分,其中一部分记录的关键字均比另一部分关键字小,则分别对这两部分继续进行排序,直到整个序列有序. 算法实现: ​ #coding: ...

  2. TortoiseGit和msysGit安装及使用笔记(windows下使用上传数据到GitHub)[转]

    TortoiseGit和msysGit安装及使用笔记(windows下使用上传数据到GitHub) Git-1.7.11-preview+GitExtensions244SetupComplete+T ...

  3. Java学习笔记——JDBC读取properties属性文件

    Java 中的 properties 文件是一种配置文件,主要用于表达配置信息,文件类型为*.properties,格式为文本文件. 文件的内容是格式是"键=值"(key-valu ...

  4. Log4Qt 使用(二)

    本文基于上一篇<Log4Qt 使用(一)>来继续完善一下关于Log4Qt的使用. 在讲解之前,我们首先来看一个例子: int main(int argc, char *argv[]) { ...

  5. POJ 1159

    区间dp 比如从i到j如果str[i] == str[j]那么i到j的值就与i+1到j-1相同,否则从i到j-1与i+1到j中选一个最优解,这道题直接定义int的二维数组会mle,用short,也可以 ...

  6. 你好,C++(20).4.2.2 表达并列条件选择的switch语句:如果……如果……如果……

    4.2.2  表达并列条件选择的switch语句:如果……如果……如果…… 在现实世界中,还有这样一类特殊的条件选择: 如果明天是晴天,我就穿T恤: 如果明天是阴天,我就穿衬衣: 如果明天是雨天,我就 ...

  7. android图形基础知识

    Android核心分析(23)-----Andoird GDI之基本原理及其总体框架 2010-06-13 22:49 18223人阅读 评论(18) 收藏 举报 AndroidGDI基本框架 在An ...

  8. LBS配置

    js: <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...

  9. Java如何从HttpServletRequest中读取HTTP请求的body

    首先贴出原文地址,尊重原作者 http://blog.csdn.net/zxygww/article/details/47045055 注意:下面方法已验证通过. HTTP请求中的是字符串数据: // ...

  10. [转]IBInspectable / IBDesignable

    原文:http://www.cocoachina.com/ios/20150227/11202.html 无论陈词滥调多少次,比起一个需要我们记住并且输入什么的界面来说,如果替换成我们能够看见并可控制 ...