CSS 在 Tizen WebView (EFL WebKit) 中不支持字体系列

Question

我在 Tizen 2.4 和 3.0 SDK 中使用基于 EFL WebKit 的 WebView 渲染一些 HTML。

<div className="hexArea" id="hexArea1">
  Content
</div>

和对应的CSS:

.hexArea {
  position: relative;
  height: 95%;
  padding: 3px;
  white-space: pre;
  text-overflow: clip;
  overflow: auto;
  border: 1px solid #0F0F0F;
  color: #0F0F0F;
  font-family: "Lucida Console", "Courier New", Courier, monospace;
}

虽然这在桌面、Android WebView、iOS WebView 等多个平台上运行良好，但它在 Tizen 应用程序上不显示固定字体。我似乎无法为页面上的任何内容设置字体。

我在 div 上尝试了 style="font-family: 'monospace'"，我试图让 CSS 只是 font-family: monospace，但是 Tizen WebView 上的 html 只是似乎不尊重 font-family.

我正在尝试以十六进制和十进制显示字节，但使用普通字体看起来很糟糕。有什么解决办法吗？

编辑：我什至试过 <pre> 标签，但显示为正常字体。

Answer 1

目前，Tizen SDK 中似乎没有默认提供固定字体资源。但是可以使用 CSS @font-face 或 Google 字体 API 在应用端显示 fixed-font。

对字体资源使用CSS@font-face。

https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

我认为你可以在你的应用程序中添加一个固定的字体资源，并使用 CSS @font-face.
使用Google字体API。

https://developers.google.com/fonts/docs/getting_started

<html>
  <head>
    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Roboto Mono">
    <style>
      .hexArea {
        font-family: "Roboto Mono";
      }
    </style>
  </head>
  <body>
    <div>normal font:1234567890</div>
    <div class="hexArea">fixed-font:1234567890</div>
  </body>
</html>

CSS 在 Tizen WebView (EFL WebKit) 中不支持字体系列

CSS in Tizen WebView (EFL WebKit) wouldn't honor font-family

html

css

webview

tizen

tizen-native-app