用户输入密码显示隐藏代码
1、新建html文档。
2、书写hmtl代码。
<div class="container main">
<div class="row">
<div class="col-md-6">
<div class="panel panel-success">
<div class="panel-heading">Bootstrap v2 Demo:</div>
<div class="panel-body">
<iframe src="v2.html"></iframe>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-info">
<div class="panel-heading">Bootstrap v3 Demo:</div>
<div class="panel-body">
<iframe src="v3.html"></iframe>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-info">
<div class="panel-heading">Meterial Design icon:</div>
<div class="panel-body">
<iframe src="mt.html"></iframe>
</div>
</div>
</div>
</div>
</div>
3、书写css代码。
body, html{
font-size: 100%;
padding: 0;
margin: 0;
background: #494A5F;
color: #D5D6E2;
font-weight: 500;
font-size: 1.05em;
font-family: "Microsoft YaHei","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif;
}
4、书写css代码。
<style>
.main { margin-top: 80px; }
.panel-body { height: 350px; }
iframe { display: block; width: 100%; height: 100%; border: none; }
</style>
5、代码整体结构。
6、查看效果。
