项目中遇到的问题1

昨天做项目的一个登陆页面的时候，效果图是左边为一个图片，右边为登陆信息，需求需要左边的图片不管屏幕怎么改变，高度始终占满屏幕的高度，刚开始一直想着用css来解决，像用到了background，但如果用background的话，图片可能在页面是没办法显示的，原因是背景图是不占页面空间的，需要在图片的容器内设置固定的宽高，但又出现了另外一个问题，屏幕有大有小的，固定的宽度或者高度都不能实现我想要的效果，后续有想到了设置background-size为contain或者cover，效果还是不行，最终还是用js来实现了，下面是我的思路，本人是新手，暂时找不到更好的解决方法，如若各位大神有其他方法，麻烦请各位来指导，谢谢！！

首先，需要先获取当前可视文档窗口的高度，$(window).height；然后找到页面上的img元素并把高度值赋值给img元素，然后，再然后。。。。哈哈，没有了，下面是我的完整代码，需要的可以看一下：

<script>

var height=$(window).height();

    	$('.img-responsive').css('height',height);

</script>

另外还有一个问题就是在布局右边的登陆信息时，我是用BootStrap来布局的，需要把里面的内容居中显示，但也是不确定宽度和高度

html代码如下：

<div class="col-md-6 login">

    		<div class="row" style="padding: 0px 50px">
        		<div class="col-md-12">
            			<form>
                			<h1>欢迎登陆</h1>
                			<div class="form-group">
                    				<input id="email" type="email" class="signUp signUp-input-box signUp-input-phone" value="请输入邮箱" placeholder="请输入邮箱">
                			</div>
                			<div class="form-group">
                    				<input type="password" class="signUp signUp-input-box signUp-pass" value="请输入密码" placeholder="请输入密码">
                			</div>
                			<div class="signUp-submit"><a class="btn btn-primary btn-block" href="javascript:;">登陆</a></div>
            			</form>

        		</div>
    		</div>
JS代码如下：

		<script>

			$('.login').css('height',height);
			var divHeight = $('.col-md-6 .row').css('height');
			$('.col-md-6 .row').css('margin-top', (parseInt(height)-parseInt(divHeight))/2);

		</script>