首页 > 代码库 > background-image 和 img

background-image 和 img

一:解决div里面的img图像宽度不变,高度不变!   超出div部分设置隐藏!

     图片:1920x526 

     div容器: 1423x526   

 1. background-image:样式实现

     img: 标签或者html组建实现

 2.一般来说,如果是装饰性的图片就使用background-img,如果和文体内容很相关就使用img

 3.加载过程:如果你用引入了一个很大的图片,那么在这个图片下载完成之前,img后的内容都不会显示。而如果用css来引入同样的图片,网页结构和内容加载完成之后,才开始加载背景                  图片,不会影响你浏览网页内容。 

 4.谨记:background图片的显示:div容器必须设置高度哦!

 

二:background-image属性研究

    

 

 三:引申(你的突破点哦)

 问题1:  当图片的大小超出容器的大小时候,用img标签合适吗?      

 问题2:  img做响应式好还是background-image做响应式好呢?     

 问题3:  css中图片何时会撑破div容器呢?         

background-image 和 img