<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>扩展简单的警告信息的实例</title>
<meta name="description" content="Extending simle alert with bootstrap. This example shows usage of alert, alert-block and alert-heading">
<link href="/statics/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<style type="text/css">
body {
padding: 50px;
}
.alert {
background-color: #fcf8e3;
border: 1px solid #fbeed5;
border-radius: 4px;
margin-bottom: 18px;
padding: 8px 35px 8px 14px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
color: #c09853;
}
.span4 {
width: 300px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="span4">
<div class="alert alert-block">
<a class="close" data-dismiss="alert">×</a>
<h4 class="alert-heading">Warning!</h4>
What are you doing?! this will delete all files!!
</div>
</div>
</div>
</div>
<script src="/statics/js/jquery-1.8.3.min.js"></script>
<script src="/statics/plugins/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>