如何刪除 HTML 的默認字體？
[英]How to remove default font of the HTML?
問題描述
I decided to use ubuntu font-family for my angular project.I overrided it succesfully.But when I refresh the page,page starts with default font then in miliseconds turning into my ubuntu font.I just want it start with ubuntu not something else.如何刪除 html 的默認字體。
我的 styles.css 下面
* {
font-family: 'Ubuntu';
}
我如何在 angular.Z466DEEC76ECDF24FCA6D38Z571F6
"styles": [
"src/styles.css",
"src/assets/css/fonts.css",
],
我的 fonts.css 下面是什么
@font-face {
font-family: 'Ubuntu';
font-display: swap;
font-style: normal;
font-weight: 300;
src: url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.eot');
/* IE9 Compat Modes */
src: local('Ubuntu Light'), local('Ubuntu-Light'), url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.woff') format('woff'), /* Modern Browsers */
url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.svg#Ubuntu') format('svg');
/* Legacy iOS */
}
來自我的控制台的屏幕截圖，向您展示它是如何被覆蓋的
4 個解決方案
解決方案1
2 已采納 2019-10-21 09:16:48
當您使用文件中的自定義字體（使用@font-face ）時，瀏覽器必須先下載該字體才能使用它（除非該字體已存在於用戶的機器上）。 雖然仍在獲取自定義字體的過程中，但大多數瀏覽器將以備用字體呈現所有受影響的文本。 這個短暫的時刻就是所謂的“無樣式文本閃現” （FOUT）。
雖然沒有保證可以防止 FOUT 的方法，但有一些方法可以改善這種情況。 我將概述兩個。
預裝 fonts
在包含 CSS 之前，將其添加到頁面的<head>中：
<link rel="preload" href="../fonts/ubuntu-v12-latin-ext_latin_cyrillic-300.eot" as="font">
這讓瀏覽器知道您想預加載具有高優先級的字體，以便它盡快可用。 可以在這篇 Google 文章中找到更多詳細信息。
使用font-display
將您的font-display規則更改為block ：
font-display: block;
這告訴瀏覽器在加載自定義字體之前不顯示任何文本。 更多細節可以在同一篇文章中找到
解決方案2
1 2019-10-21 08:43:50
當有人使用自定義 fonts 時，瀏覽器/操作系統的正常行為首先顯示正常字體，一旦加載或下載自定義字體，然后在頁面上顯示該特定字體。 這稱為 FOUT。
在此處閱讀有關此內容Web 字體在加載時閃爍
更新：您已經在使用字體。 因此，刪除該建議。
謝謝
解決方案3
0 2019-10-21 07:16:10
請將 fonts.css 代碼放入 reboot.scss 文件或刪除 font-family: sans-serif; 在 reboot.scss 文件中。 在您的 fonts.css 加載之后，您的 reboot.scss 文件首先加載是主要問題。
解決方案4
0 2019-10-21 07:53:40
這取決於您使用的字體大小。 在加載所需的字體之前，瀏覽器會嘗試顯示默認設置的字體。 您可以嘗試在系統中安裝該字體並從設置中更改默認瀏覽器字體。
如何更改html textarea的默認語言和字體並禁用其他語言和字體？
[英]how can i change default language and font of html textarea and disable other languages and font?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.