UIWebView加载本地html控制横向滚动条消失，并且显示html中的本地图片

最新推荐文章于 2021-12-31 10:21:25 发布

wangyang2698341

最新推荐文章于 2021-12-31 10:21:25 发布

阅读量1w

点赞数

分类专栏： ios

本文链接：https://blog.csdn.net/wangyang2698341/article/details/8701903

版权

本文介绍了在iOS项目中使用UIWebView加载本地HTML时遇到的乱码、样式混乱（横向滚动条）和图片不显示等问题的解决方案。通过设置HTML的UTF-8编码，调整UIWebView的解码方式，以及将图片转为Base64编码，成功实现了正常显示和页面适应。

摘要由CSDN通过智能技术生成

手头ios项目需要一些关于我们和简介的简单页面

考虑到样式的灵活性和多变行，我决定使用支持js和Css的UIWebView加载html来完成。

遇到的问题：

1.乱码问题。

2.样式混乱，横向滚动条问题。

3.图片不显示问题。

解决方案：

1.乱码问题：

a.设置html的保存格式为utf-8

b.设置UIWebView的解码方式为utf-8

  NSString *htmlPath = [[NSBundle mainBundle]pathForResource:htmlName ofType:@"html"];
    NSData *data = [NSData dataWithContentsOfURL:[NSURL fileURLWithPath:htmlPath]];
    [introductionWebView loadData:data MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:nil];
	introductionWebView.backgroundColor = [UIColor clearColor];
	introductionWebView.opaque = NO;

2.样式混乱问题：（要注意两点）

a.这自适屏幕的相对宽度，代码如下

body>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td>

b.貌似 是不被识别的，所以在页面中不要出现，另外textindent:2em;貌似过大也会造成样式不如任意；

3.图片不显示问题。

a.有问题代码

<!--<img style="display:none;width=167;height=128" src="logo.png" width="167" height="128">
                        -->

b.正确代码

<a href="www.soyinke.com">搜音客<img width="167" height="128" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAU4AAAD/CAYAAACesj8NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA1xpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDM0MiwgMjAxMC8wMS8xMC0xODowNjo0MyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1QTdFRUUyNjlCNkFFMjExQTQwNUExNDQ5RkMwNDk5RSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBOUY4QzI0Qj