Site Loader

LOCATION

VanY_Y

场景:在做微商城项目的时候,遇到了这么一个情况,客户在后台用编辑器上传产品介绍图片的时候,出现了这样的问题,在后台排的很完美,可是当手机端访问商城商品的时候出现了以下这种场景,

图片间存在空隙,这个问题困扰了一开始还摸不着头脑,查看过编辑器的html代码,没发现什么异常,图片和图片不存在<p>or<br>标签,图片也没有margin或者padding熟悉,所以以为是编辑器的设置原因.在网上百度过后,也没找到对应的问题以及解决方案(有可能搜索的关键词不对),无奈之下,只能自己慢慢摸索,后来发现,给这个页面的图片加上以下这个代码,问题就迎刃而解了

//在对应的位置设置img属性
.img{float:left;}

是所有的图片都向左浮动,便取消了图片之间的空隙,至于具体原因我也不知道怎么解释.

另外在开发移动端的时候,还会遇到这样的一种情况,就是客户在后台上传图片后,前台显示会溢出,出现横向滚动条,或者显示不完全,一开始尝试给页面的Img添加

width:100%

这个属性进行限制宽度,但是这样设置又引发了另外一个问题,当客户上传的图片很小的时候,也会变成按父辈div的100%宽度进行显示,页面就会变的很模糊,这时候你可以给Img加上这个属性进行控制.

max-width:100%;height:auto

,意思是图片的最大宽度为父辈的宽度100%,高度自动,这样就可以让图片在屏幕显示完全的情况下又不会变形.

Post Author: Vany

我是一个喜欢追求技术的小伙,在大学开始之前,自己还是一个电脑白痴,对于电脑,只会开关机,但是由于自己的兴趣,我在选专业的时候,全部选择了计算机专业,其实我也不知道为什么这样不顾家人的反对去做这个决定。上了大学后,我在大一的时候开始接触计算机硬件,设计的领域包括了电脑维修,系统封装等等。在大二的时候,我才开始接触PHP,一开始的时候还不是很懂,也没什么资源,所以学习只能靠老师讲一些特别基础的东西。在大二的一段时间,自己对服务器特别感兴趣,但是资源问题,只能自己慢慢研究,后来通过各种百度,通过翻墙获得了自己的第一个域名,.top域名。后来还弄了一个免费的虚拟空间,在结合域名,我自己弄了一个静态的个人网站。大三的时候,我在网上找到兄弟连这个网站,网站上面有一些免费的视频,特别适合新人看。从那以后,我一直在看教学视频去提高自己的能力,在后来,经过面试八连碰壁,才发现自己之前学的是那么肤浅,而且工作也没有自己想象的那么简单,但是高兴的是,目前工作的那家公司录用了我,在这个公司我真的学会了很多东西,包括一些cms网站的建设啊,微商城开发啊,还有最让自己兴奋的就是微信接口的开发等等这些。即使学了不少东西,但有些时候还是会觉得自己还是个小白,所以我必须不断的提升自己

发表评论

电子邮件地址不会被公开。