Tizen WebView（EFL WebKit）中的CSS不支持字体家族

Question

I am rendering some HTML using WebView based on EFL WebKit in Tizen 2.4 and 3.0 SDK. 我正在使用基于Tizen 2.4和3.0 SDK中的EFL WebKit的WebView渲染一些HTML。

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

and corresponding CSS: 和相应的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;
}

While this works perfectly well on several platforms such as Desktop, Android WebView, iOS WebView, it does not show fixed-font on the Tizen App. 虽然这在桌面，Android WebView，iOS WebView等多种平台上都可以很好地工作，但在Tizen App上却没有显示固定字体。 I can't seem to set font for anything on the page. 我似乎无法为页面上的任何内容设置字体。

I tried style="font-family: 'monospace'" on the div , I tried to make the CSS just font-family: monospace , but the html on the Tizen WebView just does not seem to honor font-family . 我在div上尝试过style="font-family: 'monospace'" ，我试图使CSS成为font-family: monospace ，但是Tizen WebView上的html似乎并不尊重font-family 。

I am trying to display bytes in hex and decimal, and it looks horrible with normal font. 我正在尝试以十六进制和十进制显示字节，并且使用常规字体看起来很恐怖。 Any ideas how to fix it? 任何想法如何解决？

EDIT: I even tried <pre> tag but shows in normal font. 编辑：我什至尝试<pre>标签，但以正常字体显示。

Answer 1

Currently, Fixed font resources seem to be not provided in the Tizen SDK by default. 当前，默认情况下Tizen SDK中似乎未提供固定字体资源。 But it's possible to display a fixed-font in app side using CSS @font-face or the Google Font API. 但是可以使用CSS @ font-face或Google Font API在应用程序端显示固定字体。

Use CSS @font-face with font resource. 将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 https://developer.mozilla.org/zh-CN/docs/Web/CSS/@font-face https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp
I think you can add a fixed font resource in your app and load and display the font using CSS @font-face. 我认为您可以在应用程序中添加固定字体资源，并使用CSS @ font-face加载和显示字体。
Use Google Font API. 使用Google字体API。
https://developers.google.com/fonts/docs/getting_started 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>

Tizen WebView（EFL WebKit）中的CSS不支持字体家族

问题描述

1 个解决方案

解决方案1
2 已采纳 2019-06-10 08:43:55

Tizen WebView（EFL WebKit）中的CSS不支持字体家族

问题描述

1 个解决方案

解决方案1 2 已采纳 2019-06-10 08:43:55

解决方案1
2 已采纳 2019-06-10 08:43:55