如何防止 Chrome 中頁面載入時觸發 CSS 轉換？

在頁面加載時抑制CSS 過渡啟動

在某些情況下，CSS 過渡可能會在頁面加載期間無意中激活，導致元素閃爍。在元素上應用顏色過渡時可能會出現此問題。

根據提供的範例：

CSS:

p.green {
   color: green;
   transition: color .2s;
}

p.green:hover {
   color: yellow;
}

HTML:

<p class="green">The Flashing Text</p>

頁面載入時，

中的文字將顯示為

<script> </script>

元素從黑色（初始顏色）過渡到綠色。這種行為是不需要的，並且可能會造成視覺破壞。

為了防止這種意外的轉換，解決方案涉及利用 Chrome 行為的獨特方面。當頁麵包含

時元素，Chrome 過早觸發 CSS 轉換。透過在腳本標籤中添加單空格字符，可以模擬該元素的存在，從而抑制錯誤的轉換：這個簡單的解決方法透過提供空白 解決了 Chrome 中的錯誤。表格>元素，防止在頁面載入期間不必要地啟動轉換。

以上是如何防止 Chrome 中頁面載入時觸發 CSS 轉換？的詳細內容。更多資訊請關注PHP中文網其他相關文章！