本章将通过实例讲解如何使用Bootstrap按钮，任何带有class.btn的元素都会继承圆角灰色默认按钮样式，但Bootstrap提供了一些选项来定义按钮的样式。

实例

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：基本按钮</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<h2>Bootstrap:基本按钮</h2>
<p>.btn类是按钮的基本样式</p>
<button class="btn">基本按钮</button>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap 基本按钮的更多相关文章

  1. Bootstrap -- 插件: 按钮状态、折叠样式、轮播样式

    Bootstrap -- 插件: 按钮状态.折叠样式.轮播样式 1. 按钮(Button)插件:可以添加进一些交互,比如控制按钮状态. 如需向按钮添加加载状态,只需要简单地向 button 元素添加 ...

  2. Bootstrap设置按钮禁用

    在Bootstrap中,按钮可以使用button标签或者a标签.设置按钮禁用可以通过两种方式,一种是通用CSS样式,一种是用过JS脚本动态设置,下面举例说明! <!DOCTYPE html> ...

  3. Bootstrap 原始按钮

    Bootstrap 原始按钮 <!DOCTYPE html><html><head><meta http-equiv="Content-Type&q ...

  4. Bootstrap学习------按钮

    Bootstrap为我们提供了按钮组的样式,博主写了几个简单的例子,以后也许用的到. 效果如下 代码如下 <!DOCTYPE html> <html> <head> ...

  5. yii2 配合bootstrap添加按钮

    新增一个按钮 1.bootstrap 官网:http://getbootstrap.com/ 2.bootstrap 中文官网:http://v3.bootcss.com/ 在视图文件中: <? ...

  6. Bootstrap单按钮的下拉菜单

    简介 把任意一个按钮放入 .btn-group 中,然后加入适当的菜单标签,就可以让按钮作为菜单的触发器了. 插件依赖 按钮式下拉菜单依赖下拉菜单插件 ,因此需要将此插件包含在你所使用的 Bootst ...

  7. 详解Bootstrap 定义按钮的样式（CSS）

    以下样式可用于<a>, <button>, 或 <input> 元素上: 更多关于Bootstrap 定义CSS样式的可查看:http://v2.bootcss.c ...

  8. bootstrap切换按钮点击后显示的颜色

    点击按钮后将按钮类库切换为值为btn-success ·· test ·· jquery code ·· $(".tag-checkbox").toggleClass(" ...

  9. bootstrap -- css -- 按钮

    本文中提到的按钮样式,适用于:<a>, <button>, 或 <input> 元素上 但最好在 <button> 元素上使用按钮 class,避免跨浏 ...

随机推荐

  1. AndroidStudio给Unity打jar包

    环境: AndroidStudio2.0 Unity4.68 AS打jar包 新建空工程 删除无用的MainActivity等. 新建Module Module选择Android Library,起名 ...

  2. Unity学习(六)5.x依赖打包

    http://blog.sina.com.cn/s/blog_89d90b7c0102w2ox.html unity5已经封装好了接口,所以依赖打包并没有那么神秘和复杂了. 打包: 1.定义好资源的a ...

  3. Unity亚洲开发者大会会议简录之技术篇,Profiler的一些参数的意思

    2014Unity亚洲开发者大会会议简录之技术篇 拖公司的福,有幸去了一趟北京参加了一场Unity3D的交流盛宴,在为期两天的时间内,不仅有着技术上收获,也有心灵上的震撼.现在先来说说技术方面的一些比 ...

  4. [Xcode 实际操作]九、实用进阶-(6)在Swift文件中调用Object-C的类和方法

    目录:[Swift]Xcode实际操作 本文将演示在Swift文件中调用Object-C的类和方法. 在项目文件夹[DemoApp]上点击鼠标右键 ->[New File]创建一个Object- ...

  5. PostgreSQL - N''和::bpchar

    N''的效果和::bpchar效果类似,都表示定长字符串.比如下边的sql: select n'233' as num; select '233'::bpchar as num; select '23 ...

  6. Qt 2D绘图之二：抗锯齿渲染和坐标系统

    一.抗锯齿渲染 1.1 逻辑绘图 图形基元的大小(宽度和高度)始终与其数学模型相对应,下图示意了忽略其渲染时使用的画笔的宽度的样子. 1.2 物理绘图(默认情况) 在默认的情况下,绘制会产生锯齿,并且 ...

  7. Codeforces 1142C（转化、凸包）

    可以变换坐标:x' = x, y' = y - x ^ 2,如此之后可得线性函数x' * b + c = y',可以发现两点连边为抛物线,而其他点都在这条线下方才满足题意,故而求一个上凸壳即可. #i ...

  8. getAnnotation为null的坑

    在写一个基于SpringAOP的权限控制的. 自己定义了一个注解,然后逻辑代码需要通过获取自定义注解的一个属性来进行权限控制. 下面简单上一下关键代码: 自定义注解: @Documented //有关 ...

  9. shell脚本解析json文件

    安装jq扩展 下载:jq 根据自己系统下载对应的文件 cp jq-linux64 /usr/bin cd /usr/bin mv jq-linux64 jq chmod +x jq 使用方法 假设有个 ...

  10. APICloud手机APP开发

    官网 http://docs.apicloud.com/