<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>排版样式</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body style="margin:50px;">
<!--<table class="table table-hover">-->
<!--<table class="table table-striped">-->
<!--<table class="table table-bordered">-->
<table class="table table-striped table-hover">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>吴者然1</td>
<td>男</td>
<td>12</td>
</tr>
<tr class="info">
<td>2</td>
<td>吴者然2</td>
<td>男</td>
<td>29</td>
</tr>
<tr class="success">
<td>3</td>
<td>吴者然3</td>
<td>男</td>
<td>33</td>
</tr>
<tr class="sr-only">
<td>4</td>
<td>吴者然4</td>
<td>男</td>
<td>41</td>
</tr>
</tbody>
</table>
<a href="###" class="btn btn-default">Link</a>
<input type="button" class="btn btn-default" value="按钮">
<button class="btn btn-default">按钮</button>
<button class="btn btn-success">按钮</button>
<button class="btn btn-info">按钮</button>
<button class="btn btn-info btn-lg">按钮</button>
<button class="btn btn-info btn-sm">按钮</button>
<button class="btn btn-info btn-xs">按钮</button>
<button class="btn btn-info btn-block">按钮</button>
<button class="btn btn-info btn-block active">按钮</button>
<button class="btn btn-info btn-block disabled">按钮</button>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
效果图：
相关推荐
本节课我们主要学习一下 Bootstrap 表格和按钮功能，通过内置的 CSS 定义，显示各种丰富的效果。 一．表格 Bootstrap 提供了一些丰富的表格样式供开发者使用。 1.基本格式 //实现基本的表格样式 ...
第一章 bootstrap介绍 ...第三章 表格和按钮 第四章 表单和图片 第五章 栅格系统 第六章 辅助类和响应式工具 第七章 图标菜单按钮组件 第八章 输入框和导航组件 .............共二十章，后面带开发实例！
第3章Knockout.js介绍 安装Knockout.js 基本示例 何为MVVM？ 创建ViewModel 小结 第4章数据库应用 Entity Framework介绍 Code First Database First 创建测试数据 小结 第二部分数据处理 第5章表的查询...
第3章对Bootstrap框架进行了解析，包含全局样式表、栅格系统、布局、响应式设计等内容；第4章讲解了CSS样式的优化，包含页面排版优化、表格设计优化、表单设计优化、按钮设计，以及图片和图标的设计等内容；第5~8章...
第3章 Bootstrap组件 1 按钮 操作案例1：制作Bootstrap官网案例页面 2 表格 3 CSS组件 3.1 表单 3.2 输入框组 3.3 图标 3.4 下拉菜单 操作案例2：制作收集用户信息页面 3.5 按钮组 3.6 导航和导航条 操作案例3：制作...
第1章 Bootstrap介绍 第2章 排版样式 第3章 表格和按钮 第4章 表单和图片 第5章 栅格系统 ...... 共18个章节整理学习
Bootstrap预定义的CSS样式2.1 排版2.2 代码2.3 表格2.4 表单2.5 按钮2.6 图片2.7 图标第3章 Bootstrap内置的布局组件3.1 下拉菜单3.2 按钮组3.3 按钮下拉菜单3.4 导航元素3.5 导航条3.6 面包屑式导航3.7 分页导航3.8...
bootStrap table 是一个轻量级的table插件，使用AJAX获取JSON格式的数据，其分页和数据填充很方便，支持国际化 三、使用方法 1、引入js、css [js] view plain copy <!--css样式--> <link href="css/...
2.基础布局组件包括排版、按钮、表格、布局、表单等等。3.jQuerybootstrap插件的基础4.响应式设计兼容多个终端。这是bootstrap的终极理念。5.css插件提供丰富的样式。6.js插件二. 栅格系统1.基本实现过程定义容器的...
任务-设置样式并添加到表单添加电子邮件输入在单选按钮中添加第三个选项，并将其命名为“ island” 通过将每个输入和所有单选按钮包装在一个form-group对表单进行样式设置任务-在站点中构建实用程序类使用flex实用...
第3章与后端服务器通信75 31使用$http进行XHR和JSONP请求75 熟悉数据模型和MongoLabURLs76 $httpAPI快速导览76 配置对象说明77 转换请求数据78 处理HTTP响应79 转换响应数据79 处理同源政策约束79 利用...
通过Bootstrap获取表单框和表格的编辑内容 通过Bootstrap实现了Submit按钮在表单下添加行 添加了指向社交媒体链接的参考链接以及徽标的附加照片与按钮相同的行 调整边距和整个容器的位置 提交按钮位于左侧，徽标...
前三个任务将使您成为MVP，因此请专注于第一个！ 任务1：HTML构建 创建一个标题/英雄区域，欢迎用户使用该应用程序，并使用Moment.js和setInterval()来显示当前时间和日期。 创建一个Bootstrap卡组件，解释如何...
图片转换模块(需要额外载入第三方支持类库) 36、扩展:重写了微信--菜单配置功能，支持自定义填写URL|关联节点|关联内容|关联逐浪后台调查问卷，更加敏捷便利。 37、优化:会员中心修改密码等处的样式，摒弃表格用纯...
图片转换模块(需要额外载入第三方支持类库)；36.扩展:重写了微信--菜单配置功能，支持自定义填写URL|关联节点|关联内容|关联逐浪后台调查问卷，更加敏捷便利；37.优化:会员中心修改密码等处的样式，摒弃表格用纯div...
图片转换模块(需要额外载入第三方支持类库) 36、扩展:重写了微信--菜单配置功能，支持自定义填写URL|关联节点|关联内容|关联逐浪后台调查问卷，更加敏捷便利。 37、优化:会员中心修改密码等处的样式，摒弃表格用纯...