版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/chengqiuming/article/details/86564742
一 按钮
1 代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>定制风格</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<button class="btn" type="button">基础按钮.btn</button>
<button class="btn btn-default" type="button">默认按钮.btn-default</button>
<button class="btn btn-primary" type="button">主要按钮.btn-primary</button>
<button class="btn btn-success" type="button">成功按钮.btn-success</button>
<button class="btn btn-info" type="button">信息按钮.btn-info</button>
<button class="btn btn-warning" type="button">警告按钮.btn-warning</button>
<button class="btn btn-danger" type="button">危险按钮.btn-danger</button>
<button class="btn btn-link" type="button">链接按钮.btn-link</button>
</body>
</html>2 效果
二 基本按钮
1 代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>基本按钮</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<button class="btn" type="button">我是一个基本按钮</button>
</body>
</html>2 效果
三 默认按钮
1 代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>默认按钮</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<button class="btn btn-default" type="button">默认按钮</button>
</body>
</html>2 效果
四 多标签支持
1 代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多标签支持</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<button class="btn btn-default" type="button">button标签按钮</button>
<input type="submit" class="btn btn-default" value="input标签按钮"/>
<a href="##" class="btn btn-default">a标签按钮</a>
<span class="btn btn-default">span标签按钮</span>
<div class="btn btn-default">div标签按钮</div>
</body>
</html>2 效果
