可見有色內容在Chrome中顯示爲透明

最近，我注意到一些奇怪的現象，只發生在Chrome中（我目前的版本爲58）。可見有色內容在Chrome中顯示爲透明

這是一個有點難以解釋，所以我做了一定要包括除了我的文字解釋，說明什麼是真正發生的事情清晰動畫：

的<h1>文本可見，注意計算的顏色是如何#222，內容高於（我的意思是，它看起來不像任何z-index故障）。但是，除非我調整頁面大小或使用devtools做一些修改，否則文本不可讀。可以選擇/突出顯示。

的應用與折角如果建成，可以以任何方式幫助，而我沒有使用任何類型的DOM封裝如Shadow DOM的。

2017-05-05 zurfyx

您可以鏈接到你的項目？ –

@MichaelCoker不幸的是，我不允許做更多的分享片段。哪些信息/片段可能對您有用？ – zurfyx

什麼都會重現問題。很難幫助只看一個動畫的gif。我們所能做的只是猜測。 –

我正在使用一組共享樣式（例如 - colors.scss），我在大多數模塊中導入該樣式。

home.module.ts - >home.component.ts - >home.component.scss

@import "../shared/colors.scss";

一個這種共享樣式表是typography.scss，這已經（僅示出相關位）以下：

@font-face { 
    font-family: "Sawasdee"; 
    src: url("/assets/fonts/sawasdee.ttf") format("truetype"); 
}

反覆導入字體導致屏幕閃爍，所以我所要做的就是確保它只是存在加載一次（並在應用程序的開始）。

所以我只是感動的字體導入到主模塊SCSS - >app.component.scss

2017-07-22 08:21:53 zurfyx

回答