带有 ID 选择器的 CSS 未在 android Webview 上加载答案

【问题标题】：CSS with ID selector is not loading on android Webview带有 ID 选择器的 CSS 未在 android Webview 上加载
【发布时间】：2021-09-29 06:14:17
【问题描述】：

我正在尝试使用具有 ID 选择器的 CSS 加载 html，但文件未按预期加载到 webview。

这是我尝试加载的文件：

    <!DOCTYPE html>
     <html>
      <head>
        <style>
           #para1 {
              text-align: center;
              color: red;
                   }
              </style>
              </head>
            <body>
        <p id="para1">Hello World!</p>
        <p>This paragraph is not affected by the style.</p>
  </body>
  </html>

但是，当我尝试下面的代码时，它会加载到 webview。

         <html>
            <head>
              <style>
                h1 {color:red;}
                p {color:blue;}
             </style>
             </head>
              <body>
             <h1>A heading</h1>
             <p>A paragraph.</p>
          </body>
         </html>

我已经在 WebView 上启用了这些属性：

    mWebView.setWebViewClient(new CustomWebViewClient());
    mWebView.setWebChromeClient(new CustomWebChromeClient());
    mWebView.getSettings().setSupportZoom(true); // ZoomControls
    mWebView.getSettings().setBuiltInZoomControls(true); // Multitouch
    mWebView.getSettings().setDisplayZoomControls(false);
    mWebView.getSettings().setJavaScriptEnabled(true);
    mWebView.getSettings().setDomStorageEnabled(true);
    mWebView.getSettings().setLoadWithOverviewMode(true);
    mWebView.getSettings().setUseWideViewPort(CONFIG.webviewEnableViewport());
    mWebView.getSettings().setAllowFileAccess(true);
    mWebView.requestFocus(View.FOCUS_DOWN);
    mWebView.setHorizontalScrollBarEnabled(true);
    mWebView.setVerticalScrollBarEnabled(true);

谁能帮我解决这个问题？

【问题讨论】：

link987654321@上有关 WebView 中标头的一些信息
你的意思是它不工作？对我来说，它的工作原理完全符合我的预期。 not working 对我们来说是一个非常无用的描述。那你需要更清楚。什么不工作？期望什么？你得到什么结果？
@tacoshy 我得到了第一个 sn-p 的空白页

标签： android html css webview

【解决方案1】：

我可以通过使用 base64 编码来解决这个问题。

   String encodedHtml = Base64.encodeToString(myHtmlString.getBytes(), 
   Base64.NO_PADDING);
   mWebView.loadData(encodedHtml, "text/html", "base64");

【讨论】：