Swift 将@font-face插入WKWebView_Swift_Wkwebview

Swift 将@font-face插入WKWebView

swift

Swift 将@font-face插入WKWebView,swift,wkwebview,Swift,Wkwebview,我想在WKWebView中使用自定义字体我使用insertcsstring（进入webView:WKWebView），但只要我将“@font-face{font-family:'Roboto-BlackItalic'；url（'Roboto-BlackItalic.ttf'）格式（'truetype'）；}”添加到字符串中，css就不会被计算（在本例中，任何文本的颜色都不会变为红色）该方法是从所以问题是-我如何在这种方法中使用自定义字体。我尝试了以下方法： extension Detail

我想在

WKWebView

中使用自定义字体

我使用

insertcsstring（进入webView:WKWebView）

，但只要我将

“@font-face{font-family:'Roboto-BlackItalic'；url（'Roboto-BlackItalic.ttf'）格式（'truetype'）；}”

添加到字符串中，css就不会被计算（在本例中，任何文本的颜色都不会变为红色）

该方法是从

所以问题是-我如何在这种方法中使用自定义字体。我尝试了以下方法：

extension DetailViewController {
    func insertCSSString(into webView: WKWebView) {
        let cssString = "@font-face{font-family: 'Roboto-BlackItalic'; url('Roboto-BlackItalic.ttf') format('truetype');} body { font-size: 20px; color: red; background-color: clear; } htesttwo {color: black; }"
        let jsString = "var style = document.createElement('style'); style.innerHTML = '\(cssString)'; document.head.appendChild(style);"
        webView.evaluateJavaScript(jsString, completionHandler: nil)
    }
}

你应该把你的字体放进你的项目中，然后创建一个css文件，然后像那样把字体代码放在那里

@font-face
{
    font-family: 'MonotypeSabonW04-Regular';
    src: local('MonotypeSabonW04-Regular'),url('Monotype Sabon Regular.otf') format('opentype');
}
@font-face
{
    font-family: 'MonotypeSabonW04-Italic';
    src: local('MonotypeSabonW04-Italic'),url('Monotype Sabon Italic.otf') format('opentype');
}

@font-face
{
    font-family: 'CharlotteSansW02-Book';
    src: local('CharlotteSansW02-Book'),url('Charlotte Sans Book.otf') format('opentype');
}


h1
{
    font-family: 'MonotypeSabonW04-Regular';
    font-size: 70px;
    font-weight: normal;
}

h2
{
    font-family: 'MonotypeSabonW04-Italic';
    font-size: 65px;
    font-weight: normal;
}

h3
{
    font-family: 'CharlotteSansW02-Book';
    font-size: 60px;
    font-weight: normal;
}

之后，将字体文件放在css文件夹中，并使用下面的示例加载它

let strCssHead = "<head><link rel=\"stylesheet\" type=\"text/css\" href=\"iPhone.css\"></head>"
let strbody = "<body> <h1>Font 1</h1> <h2>Font 2</h2> <h3>Font 3</h3> </body>"
        wkweb.loadHTMLString("\(strCssHead)\(strbody)", baseURL: URL(fileURLWithPath: Bundle.main.path(forResource: "iPhone", ofType: "css")!))

让strcshead=“”
让strbody=“Font 1 Font 2 Font 3”
wkweb.loadHTMLString（“\（strcshead）\（strbody）”，baseURL:URL（fileURLWithPath:Bundle.main.path（forResource:“iPhone”，of type:“css”）！）

在创建css文件之后，您应该将字体放在项目中，然后像这样将字体脸代码放在那里

@font-face
{
    font-family: 'MonotypeSabonW04-Regular';
    src: local('MonotypeSabonW04-Regular'),url('Monotype Sabon Regular.otf') format('opentype');
}
@font-face
{
    font-family: 'MonotypeSabonW04-Italic';
    src: local('MonotypeSabonW04-Italic'),url('Monotype Sabon Italic.otf') format('opentype');
}

@font-face
{
    font-family: 'CharlotteSansW02-Book';
    src: local('CharlotteSansW02-Book'),url('Charlotte Sans Book.otf') format('opentype');
}


h1
{
    font-family: 'MonotypeSabonW04-Regular';
    font-size: 70px;
    font-weight: normal;
}

h2
{
    font-family: 'MonotypeSabonW04-Italic';
    font-size: 65px;
    font-weight: normal;
}

h3
{
    font-family: 'CharlotteSansW02-Book';
    font-size: 60px;
    font-weight: normal;
}

之后，将字体文件放在css文件夹中，并使用下面的示例加载它

let strCssHead = "<head><link rel=\"stylesheet\" type=\"text/css\" href=\"iPhone.css\"></head>"
let strbody = "<body> <h1>Font 1</h1> <h2>Font 2</h2> <h3>Font 3</h3> </body>"
        wkweb.loadHTMLString("\(strCssHead)\(strbody)", baseURL: URL(fileURLWithPath: Bundle.main.path(forResource: "iPhone", ofType: "css")!))

让strcshead=“”
让strbody=“Font 1 Font 2 Font 3”
wkweb.loadHTMLString（“\（strcshead）\（strbody）”，baseURL:URL（fileURLWithPath:Bundle.main.path（forResource:“iPhone”，of type:“css”）！）

您的字体文件在哪里？它在你的设备上吗，因为fontface是从服务器上运行的，您在服务器上有html代码，并且您在应用程序中使用fontface，所以您必须在设备上安装字体文件是的，字体在设备上。字体文件在哪里？它在你的设备上吗，因为fontface是从您的html代码所在的服务器上运行的，并且您在应用程序中使用fontface，所以您必须在设备上安装字体文件。是的，字体在设备上。@stevenpcurtis这里有一个示例供您使用：@stevenpcurtis这里有一个示例供您使用：