Bootstrap 警报未出现关闭按钮 [英] Close button not appearing for Bootstrap alert
问题描述
我有以下使用引导程序的 html.它在大多数情况下都有效 - 但关闭按钮没有出现在警报中.我在这里缺少的代码是什么?请注意，我是 Bootstrap 的新手 - 所以，它可能很简单.
小提琴:http://jsfiddle.net/LijoCheeran/vxbt960c/
代码
<头><title>Bootstrap 101 模板</title><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 最新编译和缩小的 CSS --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"><身体><h1>你好，世界！</h1><div class="alert alert-success"><strong>成功！</strong>Bootstrap 应用于警报.<div style = "padding: 10px 10px 10px;"><form class = "bs-example bs-example-form" role = "form"><div类=输入组"><span class = "input-group-addon">$</span><input type = "text" class = "form-control" placeholder = "Amount"><span class = "input-group-addon">.00</span>
</表单>
<!-- jQuery 库--><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script><!-- 最新编译的 JavaScript --><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script></html>
您的代码中缺少这一行.
×</a>例如:
<!-- 你错过了这行代码 --><a href="#" class="close" data-dismiss="alert" aria-label="close">×</a><strong>成功！</strong>Bootstrap 应用于警报.祝你好运
I have following html that uses bootstrap. It works for the most part - but close button is not appearing for the alert. What is the code I am missing here? Please note that I am new to Bootstrap - so, it may be something simple.
Fiddle: http://jsfiddle.net/LijoCheeran/vxbt960c/
Code
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<h1>Hello, world!</h1>
<div class="alert alert-success">
<strong>Success!</strong> Bootstrap applied to alert.
</div>
<div style = "padding: 10px 10px 10px;">
<form class = "bs-example bs-example-form" role = "form">
<div class = "input-group">
<span class = "input-group-addon">$</span>
<input type = "text" class = "form-control" placeholder = "Amount">
<span class = "input-group-addon">.00</span>
</div>
</form>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>
you are missing this line in your code.
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
eg:
<div class="alert alert-success">
<!-- you missed this line of code -->
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<strong>Success!</strong> Bootstrap applied to alert.
</div>
Good Luck
这篇关于Bootstrap 警报未出现关闭按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
