网页中的图片高度（不能被压缩拉伸）自适应浏览器窗口高度，宽度相应的进行两边裁剪，请这个效果怎么写？

Answer 1

背景图片 no-reapt center top，用js 获取屏幕高度，赋给这个di，就可以了

Answer 2

补充一种方法：

<div class="box">&nbsp;</div>

然后 CSS 部分：

.box {
    line-height: 1;
    font-size: 10em;  /* 图片高度 */
    border: 1px solid #ccc;
    background: url(xxx.jpg) center no-repeat;  /* 图片 */
}

Answer 3

直接同css写就行了，

   width: 100%;

   padding-top: 14%;  /* 宽除以高的比例 */

   height: 0;

   position: relative;

   background: url(img/**.jpg) no-repeat center center;

   background-size: 100%;