响应式布局（三更）

<div id="container">
    <div class="main">
        <div class="head"><img src="image/tmp/banner.jpg" /></div>
    </div>
</div>


#container{
    height:1000px;
    width:100%;
}
#container .main{
    max-width:12.8rem;
    min-width:6rem;
    height:auto;
    margin:0 auto;
}
#container .main .head{
    /*height:auto;*/
    width:100%;
}
#container .main .head img{
    height:100%;
    width:100%;
}

  <input  class="txt-input txt-password " type="password" placeholder="请输入qq号码" name="password" style="display: inline;">
 <input  class="txt-input txt-password" type="password" placeholder="验证码" name="password" style="display: inline;">

<script>

    $(function() {
        $(".input-close").hide();
        displayPwd();
        displayClearBtn();
        setTimeout(displayClearBtn, 200 ); //延迟显示,应对浏览器记住密码
    });


    //显隐密码切换
    function displayPwd(){
        $(".tp-btn").toggle(
                function(){
                    $(this).addClass("btn-on");
                    var textInput = $(this).siblings(".plaintext");
                    var pwdInput = $(this).siblings(".ciphertext");
                    var pwdInput1 = $(this).siblings(".ciphertext1");
                    pwdInput.hide();
                    pwdInput1.hide();
                    textInput.val(pwdInput.val()).show().focusEnd();
                    textInput.val(pwdInput1.val()).show().focusEnd();
                },
                function(){
                    $(this).removeClass("btn-on");
                    var textInput = $(this).siblings(".plaintext");
                    var pwdInput = $(this).siblings(".ciphertext");
                    var pwdInput1 = $(this).siblings(".ciphertext1");
                    pwdInput.hide();
                    pwdInput1.hide();
                    textInput.val(pwdInput.val()).show().focusEnd();
                    textInput.val(pwdInput1.val()).show().focusEnd();
                }
        );
    }