首页新闻找找看学习计划

如何让图片铺满整个屏幕

0
悬赏园豆:10 [已解决问题] 解决于 2018-05-05 09:52

想在网页最顶端加上图片轮播,图片铺满整个屏幕,我给图片宽高设置100%,为什么不管用??


css
问题补充:

.outer{
width:1920px;
height:100%;
overflow: hidden;
}
.inner{
width:60000px;

    height:100%;
    overflow: hidden;
}
.inner li{
    width:1920px;
    height:100%;
    float: left;
    position: relative;
}
.inner li img{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: -1;
    display:block;
}
<div class="banner">
    <div class="outer">
        <ul class="inner">
            <p>
                <img src="images/banner1.jpg" alt="">
            </p>
            <p>
                <img src="images/banner2.jpg" alt="">
            </p>
            <p>
                <img src="images/banner3.jpg" alt="">
            </p>
        </ul>
    </div>



W_xiaobai的主页 W_xiaobai | 初学一级 | 园豆:139
提问于:2017-03-01 14:43
< >
分享
最佳答案
0

设置成背景啊。


收获园豆:10
长蘑菇星人 | 小虾三级 |园豆:1822 | 2017-03-01 16:01
其他回答(8)
0

style="position:absolute; width:100%; height:100%; z-index:-1"

Ctrl` | 园豆:2360 (老鸟四级) | 2017-03-01 14:49

我就是这样写的,图片不出来,外面的div应该怎样写??


支持(0) 反对(0) W_xiaobai | 园豆:139 (初学一级) | 2017-03-01 14:58

@Wwwii: 图片是啥。看不到。。我这边网络限制。太大加载不出来、可以在浏览器F12里调试css、方便快捷

支持(0) 反对(0) Ctrl` | 园豆:2360 (老鸟四级) | 2017-03-01 15:05
0

打开浏览器的 Developer Tool 查看一下,调试看看。


BUTTERAPPLE | 园豆:2948 (老鸟四级) | 2017-03-01 14:49
0

img{

  width:100%;

  height:100%;

}

js里面获取其页面的高度

设置图片的高度;

乘封 | 园豆:202 (菜鸟二级) | 2017-03-01 15:06

在后面加一个js

代码如下:

<script>
var list=document.querySelectorAll(".inner li")
var _height=document.documentElement.clientHeight;
for(var i=0;i<list.length;i++){
list[i].style.height=_height+"px"
}
</script>

支持(0) 反对(0) 乘封 | 园豆:202 (菜鸟二级) | 2017-03-01 15:16
0

 <img src="images/1.png" width="100%" height="100%"/> 

 

GDOUJKZZ | 园豆:313 (菜鸟二级) | 2017-03-01 16:57
0

width:100%;

height:100%;

青楼君子 | 园豆:204 (菜鸟二级) | 2017-03-01 17:11
0

设置成背景是种不错的选择  可以试试

零魂 | 园豆:135 (初学一级) | 2017-03-01 17:26
0

给body标签设置背景图

大黄人 | 园豆:641 (小虾三级) | 2017-03-02 13:04
0

img的宽度百分百的情况下 高度默认是根据宽度增加而等比放大的  如果需要设置高度为屏幕的高度,则首先应该设置html和body的高度为100%

dongxiaolei | 园豆:236 (菜鸟二级) | 2017-03-20 14:32
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册