css 两个图层 响应跳动

<!--有图片的就要有内容 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>

效果

 

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。