将本地css文件加载到webview中 [英] load a local css file into a webview
问题描述
我构建了一个简单的ios应用程序，可以将从服务器下载的html加载到webview中。
I built a simple ios app that loads a html downloaded from a server into a webview.
[self.webView loadHTMLString:notif.html baseURL:nil];
这很完美。问题是我需要将一个本地css文件应用到webview，我不知道该怎么做。
This works perfect. The problem is that i nedd to apply a local css file to the webview and I dont know how to do it.
我试过这样做，但样式是没有被应用。
I tried doing it this way, but the styles are not being applied.
NSString *HTML_HEADER=@"<HTML><HEAD><link rel='stylesheet' href='style.css' type='text/css'></HEAD><BODY>";
NSString *HTML_FOOTER=@"</BODY></HTML>";
NSString *htmlString = [NSString stringWithFormat:@"%@%@%@",HTML_HEADER,notif.html,HTML_FOOTER];
NSLog(@"htmlString %@", htmlString);
[self.webView loadHTMLString:htmlString baseURL:nil];
有什么想法吗？
谢谢
更新：
我尝试执行以下操作：
NSString *HTML_HEADER=@"<HTML><HEAD><link rel='stylesheet' href='#FILE1#' type='text/css'></HEAD><BODY>";
NSString *HTML_FOOTER=@"</BODY></HTML>";
NSString *cssFilePath = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css"];
NSString *html_header_with_files = [HTML_HEADER stringByReplacingOccurrencesOfString:@"#FILE1#" withString:cssFilePath];
NSString *htmlString = [NSString stringWithFormat:@"%@%@%@",html_header_with_files,notif.html,HTML_FOOTER];
NSLog(@"htmlString %@", htmlString);
[self.webView loadHTMLString:htmlString baseURL:nil];
在Build Phases中我添加了style.css
And in Build Phases i have added the style.css
更新2：
我还检查style.css是否存在
I also check if the style.css exists with
NSString* filePath = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css"];
NSLog(@"\n\nthe string %@",filePath);
推荐答案
原因是CSS和JS文件在运行时不可用用HTML渲染。
The reason is CSS and JS files not available at runtime for render in HTML.
你需要注意一些要点：
- 必须将所有CSS / JS / HTML文件添加到项目属性 >> 构建阶段 >> 复制捆绑资源。
- All CSS/JS/HTML files must be added to Project Properties >> Build Phases >> Copy Bundle Resources.
检查是否添加了所有文件，然后手动添加这些文件。
Check that all files are added if not then manually add those files.
-
所有文件都应放在同一个文件夹中，以便在运行时提供参考文件路径。
All files are should be placed in the same folder, so that reference file path will be available at run time.
而不是直接使用文件名，我更喜欢你使用标记。使用符号作为标记来替换CSS和JS文件的实际路径。
Instead of using directly file names, I will prefer you to use marker. Use symbols as a marker to replace with actual path of CSS and JS files.
例如：
NSString *HTML_HEADER=@"<HTML><HEAD><link rel='stylesheet' href='#FILE1#' type='text/css'></HEAD><BODY>";
NSString *HTML_FOOTER=@"</BODY></HTML>";
NSString *cssFilePath = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css"];
NSString *html_header_with_files = [HTML_HEADER stringByReplacingOccurrencesOfString:@"#FILE1#" withString:cssFilePath];
NSString *htmlString = [NSString stringWithFormat:@"%@%@%@",html_header_with_files,notif.html,HTML_FOOTER];
NSLog(@"htmlString %@", htmlString);
[self.webView loadHTMLString:htmlString baseURL:nil];
在上面的示例中，我已替换 style.css 来自html部分的字符串并添加标记 #FILE1＃。
In above example I have replace style.css string from html part and add marker #FILE1#.
此标记是文件<$ c的相对URL $ c> style.css 并且它将在webView中的html加载之前被替换。
This marker is relative url to file style.css and it will be replace before html load in webView.
所以每当你想将html加载到webView时，从其亲属网址加载所有资源文件。
So whenever you would like to load html to webView, load all resource files from their relatives urls.
这里 HTML_HEADER 将替换为所有资源文件的实际路径。
Here HTML_HEADER will be replace with actual path for all resources files.
这篇关于将本地css文件加载到webview中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
