Bootstrap 表格的默认样式

只需为任意的 <table> 元素应用 .table 类，即可使用表格的默认样式。Bootstrap中表格的默认样式相当简单，它仅仅在每个 <td> 上方添加了一个边框。如：

<table class="table">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<td>2</td>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<td>3</td>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>

效果如图 3‑22所示：

图3-22 Bootstrap表格的默认样式

关于作者

歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》，并全部在 GitHub 上开源。

Bootstrap 表格的默认样式相关推荐

Bootstrap 表格行的样式
除了可以为表格添加样式外,Bootstrap还专门表格的行提供了 4 个可选的情景类,来为表格的行添加特殊的背景颜色.这些情景类及含义见表 3‑2: 表 3‑2 表格行的情景类类含义 .succe ...
修改Bootstrap的一些默认样式
有些时候bootstrap的展示不能满足自己的需要,可以手动加一些样式来控制展示一个input有两个label左边一个,右边一个.control-label默认是右对齐的,放在左边是没问题,如果放在 ...
Bootstrap 表格的可选样式
除了 .table 类之外,Bootstrap还为表格提供了4个辅助类 .table-striped..table-bordered..table-hover 和 .table-condensed,分 ...
[ElementUI] 修改ElementUI默认样式
前言: 在使用ElementUI中免不了要根据自身需求修改EleUI的默认样式; <div class="form-box"><el-input v-model= ...
说说 Bootstrap 表格样式
Bootstrap 提供了一个清晰的创建表格的布局.下表列出了 Bootstrap 支持的一些表格元素: 标签描述 <table> 为表格添加基础样式. <thead> 表格 ...
Bootstrap表格样式使用方法
基本Bootstrap表格样式 Bootstrap最基本的表格样式就是在<table>标签中加入table类,然后在标签内嵌套thead和tbody元素即可. 例如:<table c ...
php输入文本框样式,【js】：检测用户输入、文本框默认样式设置、设计表格样式实现全选反选...
Topic 1 : 检测用户的输入 : 题目要求: 编写一个用户注册页面检测用户名是否是6位以下,密码是否是8位以上,如果不满足要求高亮显示文本框 : 代码如下 : 用户注册页面 .bg {back ...
【Bootstrap学习笔记】1.Bootstrap介绍、排版样式、表格和按钮、表单和图片
四.表单和图片学习内容: .form-control 表单群组内联表单表单合组水平排列复选框和单选框下拉列表校验状态添加额外图标控制大小图片 .form-control .form ...
Bootstrap 表格笔记
Bootstrap 表格 Bootstrap 提供了一个清晰的创建表格的布局.下表列出了 Bootstrap 支持的一些表格元素: 标签描述 <table> 为表格添加基础样式. < ...

Bootstrap 表格的默认样式

Bootstrap 表格的默认样式相关推荐

最新文章

热门文章