No pop, pop label only on the page tips
Introducing new labels
Alert box: class = "alert role =" alert "
Closable alert box: alert-dismissible
Inside a warning message with a link: class = "alert-link"
<! DOCTYPE HTML>
<HTML lang = "EN">
<head>
<Meta charset = "UTF-8">
<title> Bootstrap layout </ title>
<-! Page data source cross-platform compatibility make some notes - >
<Meta HTTP-equiv = "X--the UA-Compatible" Content = "IEs = Edge">
<-! adaptive multi-screen instructions ->
<Meta name = "the viewport" Content = "width = width-Device, Scale =. 1-Initial ">
<-! Awesome-incorporated font ->
<Link the href =" https://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.min.css "the rel =" this stylesheet ">
<-! on Bootstrap and jQuery ->
<Link the href =" https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.min.css "the rel = "stylesheet">
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<h1>警告框</h1>
<p></p>
<!--警告框：class="alert role="alert"-->
<div class="container">
<div class="row">
<div class="alert alert-success" role="alert">警告框1</div>
<div class="alert alert-info" role="alert">警告框2</div>
<div class="alert alert-warning" role="alert">警告框3</div>
<div class="alert alert-danger" role="alert">警告框4</ div> <div class = "Row"> <div class = "Container"> <- closable alert box:! dismissible-Alert -> <P> </ P> </ div>
</ div>
<div class="alert alert-warning alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Warning!</strong> 密码错误
</div>
</div>
</div>
<p></p>
<!--警告框中的链接class="alert-link"-->
<div class="container">
<div class="row">
<div class="alert alert-success" role="alert">
xxxxxxxxx<a href="#"class = "alert-link"> Click-to xxxxxxxxx </a> </ HTML></ body> </ div> </ div>
</ div>