<div style="background-image: url(http://your-image.jpg);">

　　<img src="http://your-image.jpg" style="opacity:0;" />
</div>

用图片去占位，把div高度撑开就可以显示背景图片

同时改变背景图和图片的宽高就可以做到div高度自适应背景图的高度啦

未知高度的div自适应图片高度的更多相关文章

  1. element-ui中轮播图自适应图片高度

    哈哈,久违了各位.我又回来了,最近在做毕设,所以难免会遇到很多问题,需要解决很多问题,在万能的博友帮助下,终于解决了Element-ui中轮播图的图片高度问题,话不多说上代码. 那个axios的使用不 ...

  2. css实现div中图片高度自适应并与父级div宽度一致

    需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...

  3. 当div自适应的高度超过预设的高度的时候出现滚动条的办法

    方法一:主要是 min-height:50px; max-height:200px;overflow: auto; <div id="ss" style="widt ...

  4. React里单页面div自适应浏览器高度占满屏幕

    可以用绝对定位方式,让div占满屏幕,css样式如下: height: 100%; width: 100%; position: absolute; top: 0px; bottom: 0px;

  5. 代码: 两列图片瀑布流（一次后台取数据，图片懒加载。下拉后分批显示图片。图片高度未知，当图片onload后才显示容器）

    代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...

  6. div自适应高度

    div自适应高度 Div即父容器不根据内容自适应高度,我们看下面的代码: <div id="main"> <div id="content"& ...

  7. 怎么可以让div自适应屏幕的高度？（已解决）

    主要解决问题的方法是用JS脚本. 先看布局, 一个div是首部,另一个div是主体,主体包含左侧菜单和右侧内容. 我想把主体div的高度自适应屏幕剩余区域,怎么做? 首先,获取可见区域的高度,docu ...

  8. div中iframe高度自适应问题

    网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...

  9. 不定高度的div背景或背景图片不显示问题

    在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度,在IE浏览器下显示正常.但是使用Firefox/opera浏览时却出现最外层Div的背景颜色和边框不起作用的问题. ...

随机推荐

  1. CEF C++调用前端js方法展示传递过来的图片数据

    转载:https://blog.csdn.net/lengyuezuixue/article/details/79769103 在项目开发过程中遇到一个需求,通过C++调用js方法传参给前端显示图片, ...

  2. C# 模拟 HTTP POST请求

    /// <summary> /// 用于以 POST 方式向目标地址提交表达数据 /// 使用 application/x-www-form-urlencoded 编码方式 /// 不支持 ...

  3. 【做题】CERC2017B. Buffalo Barricades——时间倒流

    原文链接 https://www.cnblogs.com/cly-none/p/CERC2017B.html 题意:在一个网格平面上,有\(n\)个点,其中第\(i\)个点在以\((x_i, y_i) ...

  4. 牛客练习赛43F Tachibana Kanade Loves Game

    题目地址 Link 题解 这题其实就是求1~n中有多少与2~20互质的数,然后其实只跟1~20里面的质数有关. 那么考虑容斥一下求出来一共有多少个不互质的,用n减一下就是互质的数的个数了.然后判一下a ...

  5. html 的 crossorigin 属性

    添加这个属性, 并且服务器允许跨域后,会得到精确的报错信息. 添加这个属性,但服务器不允许跨域,就会被同源策略阻止加载资源. 不添加这个属性,只能知道报错,不知道具体信息. https://www.j ...

  6. oracle 11g RAC 的基本操作（一）------启动与关闭

    启动RAC 手工启动按照HAS, cluster, database的顺序启动,具体命令如下: 启动HAS(High Availability Services),必须以root用户 [root@or ...

  7. You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'group t1,customer t2

    ### SQL: select t1.gid,t1.gname,t1.gvalue,t1.gtype, t1.gaddress,t1.gmembers, t1.gcode,t1.gphone, t2. ...

  8. pycharm的pip安装问题，需要确认适合IDE的pip版本

    python 报错     AttributeError: module 'importlib._bootstrap' has no attribute 'SourceFileLoader' 解决方法 ...

  9. laravel——基础增删改查

    一.控制器代码 <?php namespace App\Http\Controllers; use Illuminate\Support\Facades\DB; class CurdContro ...

  10. pdfmake导出页眉页脚问题

    最近做项目中遇到一个导出pdf的功能,我用的是pdfmake插件 pdf使用参考 https://blog.csdn.net/qq_24380167/article/details/78735642 ...