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
素材
