新手有两个技术性难题求解！轮播和背景图片填充的问题

1.轮播问题
一组宽度为浏览器宽度的100%的轮播图片，要保证缩放浏览器不改变图片原比例的前提下（也就是说height为auto），怎么才能让下面的框架结构不跑上来。   简单的来说就是做一组宽度已浏览器宽度100的轮播图片，不影响图片比例和框架结构。

2.背景图片填充问题
如果背景图片尺寸超过了框的大小 该怎么在不改变框大小的前提下让背景图片按比例缩小自动填充框呢？


刚学html5    希望各位大神支招啊

4 个解决方案

#1

background-size:cover;
你自己去看看这个属性

#2

该回复于2015-10-13 08:35:47被管理员删除

#3

    <ul class="focus-page-list">
        <li class="focus-page" style="background-image:url(images/1.jpg)"></li>
        <li class="focus-page" style="background-image:url(images/2.jpg)"></li>
        <li class="focus-page" style="background-image:url(images/3.jpg)"></li>
    </ul>
    <style>
        .focus-page-list {
            
        }
        .focus-page {
            background-repeat: no-repeat;
            background-position: center center;
            background-size: auto 100%;
        }
    </style>

#4

background-size:cover;背景图自适应啊。。。