首页 > 代码库 > 切图相关记录
切图相关记录
问题如图片一，还原设计图时，出现空隙
解决方案：思路，div和img去掉border，然后对应的边距都设置为0，图片设置为块级元素，会自动沾满div的空间。
.fgw-p-m-0{ padding: 0!important; margin:0 !important; img{ display: block; }} <div> <div className="fgw-p-m-0"> <img src="http://www.mamicode.com/static/image/heard.png" /> </div> <div className="fgw-p-m-0"> <img src="http://www.mamicode.com/static/image/green.png" /> </div> <div className="fgw-p-m-0"> <img src="http://www.mamicode.com/static/image/yellow.png" /> </div> <div className="fgw-p-m-0"> <img src="http://www.mamicode.com/static/image/gray.png" /> </div> <div className="fgw-p-m-0"> <img src="http://www.mamicode.com/static/image/footer.png" /> </div> </div>
解决后的效果图
解决方案二和三(在块级元素上设置font-size:0 或者 使用line-height：0)
.fgw-p-m-0{ line-height: 0; img{ /*display: block;*/ }}
切图相关记录
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。