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. Oracle 常用语句汇总

    1.查询当前用户的建表SQL: SELECT DBMS_METADATA.GET_DDL('TABLE','COL_MERCH_INFO') FROM DUAL; 2.查询当前用户的所有表: SELE ...

  2. 今天在写powershell脚本中犯的两个错误

    可能是因为牙痛没睡好,今天老是犯错,还是脚本写错,特别难调. 第一个错误: powershell脚本里面,函数与函数互相调用的传参.其实就像调用普通的cmdlet一样的写法,应该这么写: Add-Sc ...

  3. Linux输出重定向

  4. 借助共享缓存redis实现分布式锁

    新开发的系统须要控制每一个时刻回收缓存的GC线程有且仅仅有一个在执行,假设有多个线程同一时候执行,会造成系统崩溃.假设仅仅有一个JVM进程那么非常好办.简单的借助synchronizedkeyword ...

  5. angularjs之双向绑定

    今天所学习的东西虽然不是很多 但是对我来说受益匪浅, 就比如说在table中要选中一行的话我们可以这样写: 模板中: <table ng-controller="tableContro ...

  6. C# winform xml的增删改查

    代码如下: using System; using System.Collections.Generic; using System.IO; using System.Linq; using Syst ...

  7. Excel01-不同的单元格输入同一数据

    第一步:按住Ctrl键,选择不同的单元格 第二步:选择完最后一个单元格后,输入需要的数据“YES”,按Ctrl+Enter键结束. 提示:按Ctrl+; 输入当前日期,再按ctrl+Enter实现全部 ...

  8. mybati之parameterType传递多个参数

    当在查询的时候需要传入多个参数的时候该怎么办呢: 1,封装成一个Model对象,底层HashMap还是一个 User user=new User(); user.setUserName("z ...

  9. CSS学习笔记总结和技巧

    跟叶老师说项目,他叫我写一个静态首页,看起来挺简单的,但是下手才发现在真的不会怎么下手啊,什么模型啊模块啊都不懂,写毛线啊!! 如图:页面下拉还有侧栏,中间内容等. 可是答应跟老师做了,不能怂啊,于是 ...

  10. c++回调实现

    回调是A将一个函数指针传给B,然后调用B,B在执行自身函数后,再在合适的时候执行A的这个函数指针,这样就能避免A和B的相互包含和链接,在大型项目中回调是一种打破循环依赖的常用技术. typedef v ...