iOS中用UIWebView的loadHTMLString后图片和文字失调,图片过大,超过屏幕,文字太小。或者图片太小。文字太大,总之就是不协调。

我们的需求是让图片的大小跟着屏幕的变化而变化。就是动态的去适应屏幕。那么文字的字体就是我们自己能够控制,可大可小。要想达到这种效果。我们要在用loadHTMLString载入字符串之前对它进行处理。怎么处理呢?什么原理呢?

处理HTMLString的方法:

  NSString *htmls = [NSString stringWithFormat:@"<html> \n"
"<head> \n"
"<style type=\"text/css\"> \n"
"body {font-size:15px;}\n"
"</style> \n"
"</head> \n"
"<body>"
"<script type='text/javascript'>"
"window.onload = function(){\n"
"var $img = document.getElementsByTagName('img');\n"
"for(var p in $img){\n"
" $img[p].style.width = '100%%';\n"
"$img[p].style.height ='auto'\n"
"}\n"
"}"
"</script>%@"
"</body>"
"</html>",htmlString];

处理HTMLString的原理:

原理就是用一个for循环,拿到全部的图片,对每一个图片都处理一次,让图片的宽为100%,就是依照屏幕宽度自适应。让图片的高atuo,自己主动适应。文字的字体大小,能够去改font-size:15px,这里我用的是15px。依据自己的详细需求去改吧。

另外博主维护一个iOS开发技术支持群

iOS中用UIWebView的loadHTMLString后图片和文字失调解决方法的更多相关文章

  1. [转载] IOS 获取网络图片的大小 改变 图片色值 灰度什么的方法集合

    IOS 获取网络图片的大小 改变 图片色值 灰度什么的方法集合

  2. ios/iphone手机请求微信用户头像错位BUG及解决方法

    转:http://www.jslover.com/code/527.html ios/iphone手机请求微信用户头像错位BUG及解决方法 发布时间:2014-12-01 16:37:01 评论数:0 ...

  3. 网站启动SSL, http变为https后,session验证码错误解决方法

    网站启动SSL, http变为https后,session验证码错误解决方法   最近公司需要后台启动安全证书,证书安装完毕后,后台老提示 验证码错误,经过几天的研究,此问题已经得到有效解决,现把方法 ...

  4. IOS开发证书变成“此证书的签发者无效”解决方法

    IOS开发证书全部变成无效,如下图  打包提示错误  解决方法: 1. 下载https://developer.apple.com/certificationauthority/AppleWWDRCA ...

  5. universal image loader在listview/gridview中滚动时重复加载图片的问题及解决方法

    在listview/gridview中使用UIL来display每个item的图片,当图片数量较多需要滑动滚动时会出现卡顿,而且加载过的图片再次上翻后依然会重复加载(显示设置好的加载中图片) 最近在使 ...

  6. dedecms织梦系统后台验证码图片不显示的解决方法

    网站迁移后,dedecms织梦系统后台验证码图片不显示的解决方法通用解决方案-取消后台验证码功能因为没有验证码,不能进后台,所以修改php文件源代码:方法一:打开dede/login.php 找到如下 ...

  7. 【Qt开发】QScrollArea添加布局后没有出现滚动条的解决方法

    [Qt开发]QScrollArea添加布局后没有出现滚动条的解决方法 标签:[Qt开发] 说明:尝试利用滚动区域显示多张图片,为了能够动态地往滚动区域贴图,为滚动区域设置了布局,然后通过布局来添加wi ...

  8. 安装Wamp后 Apache无法启动的解决方法

    安装Wamp后 Apache无法启动的解决方法,网上的解决方案可以说是五花八门,有些说了一大推,一点作用都起不到. 其实解决方法只需两步: 1.安装路径不能包含有中文,这个我不知道为什么,总之如果安装 ...

  9. IE/Chrome背景图片居中1px偏移解决方法

    最近在支持行业运营的一个推广页面,遇到了非常规的页面banner图居中的问题,为了解决此问题,做了简单的测试,做了一个小结,为经常做大促页面的兄弟姐妹们提供参考解决方案. 首先来看看现象.最经典的页面 ...

随机推荐

  1. android的布局-----RelativeLayout(相对布局)

    学习导图 注:父容器定位的属性值只能是Boolean ,兄弟组件定位的属性值只能是ID 典型案例(梅花) <?xml version="1.0" encoding=" ...

  2. cisco packet 实验教程(二)

    06. 三层交换机实现VLAN间路由 技术原理 1)三层交换机是带有三层路由功能的交换机,也就是这台交换机的端口既有三层路由功能,也具有二层交换功能.三层交换机端口默认为二层口,如果需要启用三层功能就 ...

  3. java 修改字体大小

    在Windows->Preferences->General->Appearance->Colors and Fonts->Java->Java Editor Te ...

  4. Android TextView 中实现部分文字变色以及点击事件

    首先要想实现文字变色以及点击,都需要使用到SpannableStringBuilder,实例化该类也很简单,只需将你想要处理的字符串当做参数 SpannableStringBuilder spanna ...

  5. MapReduce1 工作机制

    本文转自:Hadoop MapReduce 工作机制 工作流程 作业配置 作业提交 作业初始化 作业分配 作业执行 进度和状态更新 作业完成 错误处理 作业调度 shule(mapreduce核心)和 ...

  6. getServletConfig().getInitParameter("count1") java.lang.NullPointerException

    通常在doget中 System.out.println(getServletConfig()); System.out.println(getServletConfig().getInitParam ...

  7. Linux(二) 常用命令

    Linux简介及Ubuntu安装 Linux,免费开源,多用户多任务系统.基于Linux有多个版本的衍生.RedHat.Ubuntu.Debianaa   安装VMware或VirtualBox虚拟机 ...

  8. Flexible and Economical UTF-8 Decoder

    http://bjoern.hoehrmann.de/utf-8/decoder/dfa/

  9. sublime去除空白行和重复行

    去除空白行 edit -> line -> delete blank lines 去除重复行 打开正则模式 1 edit-> sort lines 2 command+option+ ...

  10. GLSL纹理贴图 【转】

    转载:http://blog.csdn.net/hgl868/article/details/7872466 简单的纹理贴图(Simple Texture) 为了在GLSL中应用纹理,我们需要访问每个 ...