<!--有图片的就要有内容 background:url(images/123.jpg); 加载背景 background-size 100% 400px; 宽度本身第一层就可以定义 高度以第二层div高度为限制 background-repeat: no-repeat;只显示一张图片 background-position:center;图片居中 -->

<div style="background:url(images/123.jpg);background-size: 100% 400px;background-repeat: no-repeat;background-position:center;">

<!-- 宽度以父类为标准 外层图片的大小-->

<div style="width:90%;height:500px;text-align: center;">

<!-- <img src="1111.jpg" style="margin:0 auto;margin-top:100px" width="20%" height="260px" > -->

<!-- 用百分比 第二层图片自适应 -->

<div style="background-position:center;background-image:url(images/1111.jpg);background-size: 20% 300px;background-repeat: no-repeat; ">

<!-- 设置内部图片大小 -->

<div style="width:500px; height:500px"></div>

</div>

</div>

</div>

效果