【发布时间】:2019-02-04 20:06:51
【问题描述】:
我们正在构建一个 Web 应用程序,根据加载应用程序时从数据库中提取的 Material UI JSON 主题,不同的用户会看到不同的颜色、字体、边框宽度等。
问题来自于动态字体。 人们尝试了哪些方法来动态加载主题所需的字体? 需要明确的是,一个用户看到的字体可能与另一个用户看到的字体不同。
例如,用户一可能有以下主题定义:
"fontFamily": "'Galaxie', sans-serif"
虽然用户 2 可能具有以下主题定义:"fontFamily": "'Roboto', Arial, sans-serif"
通常您会定义一个 CSS 文件或在 HTML 中添加一行,以便从服务器加载这些字体。但是,我们希望用户一只需下载Galaxie 字体,而用户二只需下载Roboto 字体。
我们正在考虑的当前解决方案:
- 只是让所有用户加载所有字体(不会大规模工作)
- 创建一个 CSS 文件来定义字体,该文件会根据用户从服务器请求它动态填充
【问题讨论】:
-
您可能会觉得这很有帮助:github.com/zachleat/web-font-loading-recipes
标签: css reactjs fonts material-ui dynamic-content