具有自定义字体类型和颜色的 WKWebView

Question

我想在 WKWebView 加载带有自定义字体系列和文本颜色的 html 字符串，我试图将此 CSS 嵌入 HTML 但它不起作用:( 。

 [NSString stringWithFormat:@"<html> \n"
                                   "<head> \n"
                                   "<style type=\"text/css\"> \n"
                                   "body {font-family: \"%@\"; font-size: %d;}\n"
                                   "</style> \n"
                                   "</head> \n"
                                   "<body>%@</body> \n"
                                   "</html>", @"DINNextLTW23Regular", self.fontSize,@"Text"];

Answer 1

font-family应该是系统字体系列。否则，您必须将自定义字体文件导入您的项目。

Answer 2

首先您可以创建一个 css 文件，然后在该文件中添加您的字体和样式

@font-face {
    font-family: 'FONT_FAMILY';
    src: local('FONT_FAMILY'),url('FONT_FILE_NAME.otf') format('opentype');
}

h1 {
    font-family: 'FONT_FAMILY';
    font-size: 20px;
    font-weight: normal;
}

并使用 css 文件加载 html 字符串

NSString *css = [NSString stringWithFormat:@"<head>"
                        "<link rel=\"stylesheet\" type=\"text/css\" href=\"YOUR_CSS_FILE.css\">"
                        "</head>"];
NSString *content = [NSString stringWithFormat:@"<body>"
                        "<h1>%@</h1>"
                        @"</body>", @"YOUR_TEXT"];

[_wkWebView loadHTMLString:[NSString stringWithFormat:@"%@%@", css, content]
                   baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"YOUR_CSS_FILE" ofType:@"css"]]];

您可以将样式名称 h1 更改为您的样式名称

具有自定义字体类型和颜色的 WKWebView

WKWebView with custom font type and color

webkit

objective-c

ios

wkwebview