关于图片做div背景高度自适应问题

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

.div1{
    width: 100%;
    height:4000px;
    background-image: url("http://img1.sycdn.imooc.com/climg//59c9f7ce0001839219034033.png");
    background-size: cover;
    background-repeat: no-repeat;
}
.img1,.img2{
    width: 224px;
    height: 364px;
    position: fixed;
    top: 0;
    bottom: 0;
    /*left: 0;*/
    /*right: 0;*/
    margin: auto;
}
.img1{
    left: 0;
}   
.img2{
    right: 0;
}

.div1里的高度怎么自适应背景图片的高度呢?

LeslieChan994 2019-11-27

源自：CSS定位 7-2 编程练习

16

收起

2回答

好帮手慕阿满回答被采纳获得+3积分 2019-11-27 16:29:19

是的，图片需要放在有具体尺寸的容器中才能显示。不过不是高度自适应，宽度默认百分百，而是显示容器宽度的图片。比如容器的尺寸比图片小，则只能显示部分图片，如果容器尺寸比图片大，则会重复显示图片。

fixed表示固定定位，与absolute定位类型类似，但它的相对移动的坐标是视图本身。

祝：学习愉快~

好帮手慕阿满 2019-11-27 11:44:10

同学你好，如果是div适应图片高度，图片应该在div中，使用img标签显示图片，而不是使用背景图片。

如果我的回答解决了你的疑惑，请采纳。祝：学习愉快~

提问者 LeslieChan994 #1

也就是说背景图片设置必须要依存在一个有具体尺寸的容器的里(div),否则无法显示?图片放在div里也相当于文档流的填充规则(高度自适应,宽度默认100%)吗?还有,fixed定位也是一种特殊的绝对定位么?

2019-11-27 15:08:42

相似问题

怎么让div自适应背景图片尺寸

图像自适应

背景图片的显示方式

关于背景图片和列表图片的问题

自定义searchBar，背景图片高度大于70像素，就变成灰色了，为什么呢？

登录后可查看更多问答，登录/注册

2. 从网页搭建入门JavaWeb

参与学习人
提交作业 676 份
解答问题 9666 个

本阶段将从前端网页搭建入手，到Java Web基础，前后端结合助你完成Java Web小白的蜕变！

本课精华内容

问答作业

4-3个人程序源码，提供给各位参考！

63 1

2-4 编程练习

22 1

text-align和direction有什么区别

13 1

交作业交作业交作业

225 2

是不是只有在JS语言中局部变量的定义才可以放在else语句中

24 1

查看更多本课问答

请稍等 ...

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

扫描二维码
关注慕课网微信公众号