移动Web开发图片自适应解决方案

在html里面插入图片,如果想让图片自适应屏幕的大小而不是宽高固定不变,一般情况下可以在css代码里加入一行代码即可解决

img { height: auto; width: auto\9; width:100%; }

 

个别特殊情况就需要通过JS来解决了

 

说明:代码中的resize函数,是捕捉屏幕窗口变化,始终保证图片根据屏幕宽度合理显示。当然了,前提是像我的项目一样,文章直接为副文本格式,图片的父级标签已经设定了text-align:center的居中属性。如果你的文章内容是直接调用第三方的,那么你可以在上面的javascript代码中添加相应的处理语句即可。

 

 

  • 我的微信
  • 我的微信扫一扫
  • weinxin
  • 我的QQ
  • 我的QQ扫一扫
  • weinxin
avatar

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: