从用户样式表中注入css，不带过渡

Injecting css without transitions from user-stylesheets

本文关键字：css 注入 用户 样式      更新时间：2023-09-26

我已经用webpack建立了一个构建，其中我所有的css注入作为内联css在头部，并在主javascript文件加载后创建。

我在页面加载时发生了很多过渡，我相信这是因为user-agent样式表。

假设我有一个背景色为黑色的按钮，默认情况下，背景色从白色开始，当我输入:

button {
    transition: all 0.4s ease;
    background-color:black;
}

是否有办法阻止浏览器从默认样式表过渡?

如果在正文中添加一个类名，例如.no-transition，会怎么样呢?

在你的文档css中包含如下内容:body.no-transition * { transition:none !important; }

这将有希望覆盖所有即将加载到页面中的过渡。

在你的css被插入到头部后，使用javascript或jquery从body标签中移除.no-transition类

相关文章：