BootStrap 登录/注册模态框

<!--模态对话框的触发元素-->
  <a data-toggle="modal" href="#modal-login">登录</a>
  <button data-toggle="modal" data-target="#modal-register" type="button">注册</button>

</div>

<!--模态框是固定定位的，默认隐藏，推荐写在body的最后-->
<div id="modal-login" class="modal">  <!--半透明的遮罩层-->
  <div class="modal-dialog"> <!--尺寸和定位-->
    <div class="modal-content">  <!--背景/边框/倒角/阴影-->
      <div class="modal-header">
        <span class="close" data-dismiss="modal">&times;</span>
        头部
      </div>
      <div class="modal-body">主体</div>
      <div class="modal-footer">尾部</div>
    </div>
  </div>
</div>

<div id="modal-register" class="modal">  <!--半透明的遮罩层-->

</div>

以上代码效果图如下：