关于bootstrap--表格(table的各种样式)
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的各种样式)的更多相关文章
- __x__(40)0909第五天__表格 table 的 css 样式 美化
如果就向下面的代码那样,不写 tbody , 则浏览器自添加 tbody , 并将所有的 tr 移入 tbody 意味着 tr 并非 table 的子元素,而是 tbody 的子元素. 所以 以后编写 ...
- 关于element-ui表格table设置header-cell-class-name样式不起作用的原因分析
在编写表格的时候想给表头添加样式,使用 header-cell-class-name怎么都添加不上样式,检查元素发现连class都没添加上,查了很多资料有人说element之前版本不支持这属性,但我使 ...
- 表格Table好看的样式表
caption { padding: 0 0 5px 0; width: 700px; font: italic 11px "Trebuchet MS" , Verdana, Ar ...
- amazeui学习笔记--css(HTML元素5)--表格Table
amazeui学习笔记--css(HTML元素5)--表格Table 一.总结 1.基本样式:am-table:直接模块名 <table class="am-table"& ...
- 关于Vue.cli 脚手架环境中引入Bootstrap时,table表格样式缺失的解决办法
Vue+bootstrap不能正常使用table的样式 环境:下载官网的本地bootstrap包,然后在vue 的index.html引入bootstrap的css和js环境 问题描述:1. vue里 ...
- BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))
上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...
- Bootstrap表格样式(附源码文件)--Bootstrap
1.表格默认样式 <h4>表格默认样式</h4><table><!--默认样式--> <tr><th>序号</th> ...
- Bootstrap -- 表格样式、表单布局
Bootstrap -- 表格样式.表单布局 1. 表格的一些样式 举例: <!DOCTYPE html> <html> <head> <meta http- ...
- bootstrap表格样式
一:表格基本格式 <table> <tr> <th>标题一</th> <th>标题二</th> </tr> < ...
- jQuery 选择表格(table)里的行和列及改变简单样式
本文只是介绍如何用jQuery语句对表格中行和列进行选择以及一些简单样式改变,希望它可以对jQuery表格处理的深层学习提供一些帮助jQuery对表格(table)的处理提供了相当强大的功能,比如说对 ...
随机推荐
- Oracle 常用语句汇总
1.查询当前用户的建表SQL: SELECT DBMS_METADATA.GET_DDL('TABLE','COL_MERCH_INFO') FROM DUAL; 2.查询当前用户的所有表: SELE ...
- 今天在写powershell脚本中犯的两个错误
可能是因为牙痛没睡好,今天老是犯错,还是脚本写错,特别难调. 第一个错误: powershell脚本里面,函数与函数互相调用的传参.其实就像调用普通的cmdlet一样的写法,应该这么写: Add-Sc ...
- Linux输出重定向
- 借助共享缓存redis实现分布式锁
新开发的系统须要控制每一个时刻回收缓存的GC线程有且仅仅有一个在执行,假设有多个线程同一时候执行,会造成系统崩溃.假设仅仅有一个JVM进程那么非常好办.简单的借助synchronizedkeyword ...
- angularjs之双向绑定
今天所学习的东西虽然不是很多 但是对我来说受益匪浅, 就比如说在table中要选中一行的话我们可以这样写: 模板中: <table ng-controller="tableContro ...
- C# winform xml的增删改查
代码如下: using System; using System.Collections.Generic; using System.IO; using System.Linq; using Syst ...
- Excel01-不同的单元格输入同一数据
第一步:按住Ctrl键,选择不同的单元格 第二步:选择完最后一个单元格后,输入需要的数据“YES”,按Ctrl+Enter键结束. 提示:按Ctrl+; 输入当前日期,再按ctrl+Enter实现全部 ...
- mybati之parameterType传递多个参数
当在查询的时候需要传入多个参数的时候该怎么办呢: 1,封装成一个Model对象,底层HashMap还是一个 User user=new User(); user.setUserName("z ...
- CSS学习笔记总结和技巧
跟叶老师说项目,他叫我写一个静态首页,看起来挺简单的,但是下手才发现在真的不会怎么下手啊,什么模型啊模块啊都不懂,写毛线啊!! 如图:页面下拉还有侧栏,中间内容等. 可是答应跟老师做了,不能怂啊,于是 ...
- c++回调实现
回调是A将一个函数指针传给B,然后调用B,B在执行自身函数后,再在合适的时候执行A的这个函数指针,这样就能避免A和B的相互包含和链接,在大型项目中回调是一种打破循环依赖的常用技术. typedef v ...