Question

我在iOS（swift）应用程序中使用WKWebView，我正在使用loadHTMLString（string，baseURL :)。现在的问题是我希望HTML在框架中垂直居中。文本长度可变。我怎么能这样做？

这是来自Xcode的HTML的屏幕截图：

这是输出的图像。顶部HTML位于上方，我希望它在视图中居中对齐（视图距离顶部300点）：

Answer 1

尝试将此HTML与内联CSS一起使用，您可以替换想要居中的div之间的内容：

  <div style="display:flex;align-items:center;height:100%;justify-content:center;">
    <p>You content here</p>
  </div>

此代码适用于我在iPhone 6模拟器上使用Swift 3.0

import UIKit
import WebKit

class ViewController: UIViewController {

    var webView:WKWebView?

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func viewDidAppear(_ animated: Bool) {
        webView = WKWebView(frame: self.view.frame)
        self.view.addSubview(webView!);
        addHTML()
    }

    func addHTML() {
        let html = "<html><body><div style='height:100%;background-color:black;display:flex;align-items:center;justify-content:center;'><p style='color:white;font-size:100px;'>Asleepace</p></div></body></html>";
        webView!.loadHTMLString(html, baseURL: nil)
    }
}

如何在WKWebView中垂直居中文本？

1 个答案:

示例输出