UIWebView加载CSS样式的html

效果

源码

//
//  ViewController.m
//  CSS
//
//  Created by YouXianMing on 16/7/19.
//  Copyright © 2016年 YouXianMing. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor whiteColor];
    CGFloat width             = self.view.bounds.size.width;
    CGFloat height            = self.view.bounds.size.height;

    NSString *cssContentString = [NSString stringWithFormat:
                                  @"<html> \n"

                                  "<head> \n"
                                  "<style type=\"text/css\"> \n"
                                  "h1       {font-size: 20; font-family: \"Heiti SC\"; color: 4C4741;}\n"
                                  "body     {font-size: 15; font-family: \"Heiti SC\"; color: 4C4741;}\n"
                                  "p.style1 {text-indent: 2em;} \n"
                                  "p.style2 {text-indent: 2em; color: 000000;} \n"
                                  "</style> \n"
                                  "</head> \n"

                                  "<body>"
                                  "<h1 align=\"center\">穷玩车,富玩表,SB玩电脑??</h1>"
                                  "<p class=\"style1\">别沮丧了。虽然你不曾拥有一场说走就走的旅行,但至少还有一个说胖就胖的体型呀。</p>"
                                  "<p class=\"style2\"><i>虽然你的年龄过不了六一儿童节,但你的身高可以啊!</i></p>"
                                  "%@"
                                  "</body> \n"

                                  "</html>", [self htmlForJPGImage:[UIImage imageNamed:@"IMG_2845.jpg"]]];

    UIWebView *webView      = [[UIWebView alloc] initWithFrame:CGRectMake(0, 40, width, height - 40)];
    webView.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:webView];
    [webView loadHTMLString:cssContentString baseURL:nil];
}

- (NSString *)htmlForJPGImage:(UIImage *)image {

    CGFloat   width       = self.view.bounds.size.width;
    NSData   *imageData   = UIImageJPEGRepresentation(image,1.0);
    NSString *imageSource = [NSString stringWithFormat:@"data:image/jpg;base64,%@",[imageData base64EncodedStringWithOptions:0]];
    return [NSString stringWithFormat:@"<img src=\"%@\" width = %f />", imageSource, width];
}

@end

细节

1. 自己给一张图片测试

2. CSS样式

3. CSS学习地址

http://www.w3school.com.cn/css/index.asp

素材

时间: 2024-10-25 13:35:15

UIWebView加载CSS样式的html的相关文章

requirejs加载css样式表

1. 在 https://github.com/guybedford/require-css 下载到require-css包 2. 把css.js或者css.min.js复制到项目的js目录下 3. 在require.config配置map map: { '*': { 'css': 'require/css' } } 4.配置css依赖: 直接在shim的deps节点配置需要的css文件 shim: { bootstrap: { deps: [ 'jquery', 'css!../../boot

ASP.NET重写Render 加载CSS样式文件和JS文件(切换CSS换皮肤)

网页换皮肤的方式有很多种,最简单的通常就是切换页面CSS,而CSS通常写在外部CSS文件里.那么切换CSS其实就是更换html里的link href路径.我在网上搜索了下. 一般有两种方式: 1.页面放一个Holder控件.然后用编程方式把当前用户的风格css link写入页面. 2.过反射机制,逐个控件设置css样式. 上面两种方式都挺麻烦的,第一种需要在每个页面上放一个holder控件,类似的做法还有把link标签加runat=server的做法,页面多了,都比较麻烦.第二种不用考虑了,性能

如何解决Extent report 无法加载CSS样式 的问题

how to fix the ExtentReport.html without css styple See the highlight, add htmlReporter.config().setResourceCDN(ResourceCDN.EXTENTREPORTS); private void init(List<XmlSuite> xmlSuites) { String suiteName = xmlSuites.get(0).getName(); ExtentHtmlReport

ajax加载html文件并执行其中的js代码,加载css样式

function callback(res){ var node = document.createElement('div'); node.innerHTML = res; document.body.appendChild(node); var scriptNodes = node.getElementsByTagName('script'); var len = scriptNodes.length; var styleNodes = node.getElementsByTagName('

使用UIWebView加载本地或远程服务器上的网页

大家都知道,使用UIWebView加载本地或远程服务器上的网页,sdk提供了三个加载接口: - (void)loadRequest:(NSURLRequest *)request; - (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL; - (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)

使用media来加载css

默认的,css被当做渲染时候必须加载的资源. 设备类型和设备询问允许我们设置一些css资源编程可选的 对于所有的css资源,无论是必须的还是可选的,都会被浏览器加载 The New York Times with CSSThe New York Times without CSS (FOUC) 上面显示了加载css和不加载css样式的效果,不加载css显示的页面同样被叫做 “Flash of Unstyled Content” (FOUC). 所有,页面的渲染必须需要DOM和CSSOM. css

加载 CSS 时不影响页面渲染

转自:http://www.oschina.net/translate/loading-css-without-blocking-render 本文展示了一种技术,它能通过异步下载样式表,以阻止它们的下载阻塞页面的渲染,从而尽可能快的让访问者获取到信息内容. 警告! 我发这篇帖子全是好意,但是它并不负责让读它的人意识到下面将会遇到的问题. 社区很快地给了我许多的反馈 (有些反馈我很感激) ,而越来越明显的是这项技术并不如我所希望的那样稳定. 不像我那样的成功地对它进行了测试和利用,许多开发者在

Yii2 加载css、js 载静态资源

Yii2提供了AppAsset类管理静态资源,在使用Yii2 布局模板时,如果想在某个页面内部写一段js 并且在页面底部,如果直接使用 script 标签是不可以的. 使用AppAsset类管理静态资源 打开assetsAppAsset.php,定义 addJs(),addCss() 分别用于在静态页面引入外部js.css 文件 1.修改AppAsset.php文件代码namespace backend\assets;use yii\web\AssetBundle;/** * @author Q

升级到了IE11,在IE9以上无法加载css

最近项目需要,客户一直说IE有问题,我看了IE7.8.9没问题,结果客户说的IE是10和11,⊙﹏⊙b汗,只好去下载IE11看看. 结果浏览器下好了,打开本地静态页面的时候出现了这个提示: “CSS 因 Mime 类型不匹配而被忽略” ,然后再审查元素,也是看不到任何的css样式. 随后搜了一下解决方法: 1.开始--运行--输入:regedit,确定后就进入了注册表编辑器: 2.检查下注册表中HKEY_CLASSES_ROOT\.css 里面的Content Type是否是text/css,不