为了账号安全，请及时绑定邮箱和手机立即绑定

css 怎么控制图片不变形

首页 猿问 css 怎么控制图片不变形

css 怎么控制图片不变形

JavaScript
哈士奇WWW 2019-05-21 09:37:54
在做一个小程序的需求：就是让后台穿过的img的数据显示不变形，但是设计给的效果是70乘70，后台传过的img的尺寸不固定可能是100乘200、或者80乘120等等人物的头像。有什么解决的方法可以解决穿过的图片不变形吗在对应的70*70的容器里面，或者怎么剪裁只限制只显示头像部分也可以，我试验image的mode里面的属性，但是都不尽如意，有做过的大神请指教一下谢谢。
查看完整描述

1 回答

?
炎炎设计

TA贡献1808条经验 获得超4个赞

.wrapper{
height:70px;
width:70px;
}
img{
height:100%;
width:100%;
object-fit:cover;
}
之前的写错了
                            

                            
查看完整回答

                        

                        

                            
                            
                            反对
                            回复

                                                                                                                2019-05-21
                        

                                                

                            
    
                                                            

                                                        
                        

                    

                

                            

                                

    


    

        

            
    
                
  • 
                    1
                    回答
                
    • 
                
  • 
                    0
                    关注
                
    • 
                
  • 
                    1311
                    浏览
                
    • 
            

                        
                
            
                        

                
                

                                    

            

        

        
        

        
        
        
                

        
                    

                
慕课专栏

                更多
                
            
 
                
        

            
        

        
    








    
添加回答

    
    









    

    

    

    

        
        了解更多
    

    
    






	

		
举报

		
	

	

		

		  	

			

			

		

	

	

		
		
0/150

	

	

		
提交

		
取消

	













    
        
        微信客服
        

            
购课补贴
联系客服咨询优惠详情

            

        

    
    
        
        帮助反馈
    
    
    
        
        APP下载
        

            
慕课网APP
您的移动学习伙伴

            

        

    

    
        
        公众号
        

            
扫描二维码
关注慕课网微信公众号