猿问

回到首页 个人中心 反馈问题 注册登录
下载APP
首页 课程 实战 体系课 手记 专栏 慕课教程

用css、如何让图片自动适应屏幕大小,不出现滚动条,不变形，兼容各个浏览器

/*把图片做背景图*/
#st-integral-page.background-box{
width:100%;
height:100%;
top:0;
z-index:-1;
position:absolute;
}
/*把图片做背景图*/
#st-integral-page.background-box.img-background{
display:block;
outline:none;
border:0;
height:100%;
width:100%;
}
这样图片会变形.....

			

				
慕妹3146593

				
浏览 717回答 2

			

			
			
		

		


		

		

			
			
2回答

			

				
				

					
					
神不在的星期二

					
链接描述这个其实是个很复杂的问题，要是简单就直接图片宽度100%，高度自适应，或者将图片当做背景来使用，然后在背景图片中添加一个background-size:contain;属性。如果你有空的话可以看一下我这篇博客，最后提到了手机淘宝响应式的原理，使用rem配合viewport。

					

						

							
							
						

						
0

					

				

				
				

					
					
慕容森

					
把img隐藏掉然后用js去把img的src获取赋给容器div作为背景图设置成cover就可以如果不用js又要兼容各个浏览器那么建议你用backgroundimage本来使用object-fit:cover也行但兼容性不行一定要用img而兼容性又要好的话是一定要配合js的

					

						

							
							
						

						
0

					

				

				
			

			
		

		

			
			打开App，查看更多内容
		

	

	

	随时随地看视频慕课网APP


	
	
	

		
相关分类

		

			
			

			
				 JavaScript