我用 CSS 创建了一个页面。现在我必须从我的编辑器切换到我的浏览器并刷新整个页面，只是为了看看每一个微小的变化。但是我不想刷新页面，因为我有一些动画。
那么有什么东西可以让我的网站在 CSS 更新后自动更新？
也许使用 JavaScript、jQuery、Ajax 或其他东西？
【问题讨论】：
标签： javascript jquery html css ajax
你在这里：http://cssrefresh.frebsite.nl/
CSSrefresh 是一个小型、通畅的 javascript 文件，用于监控网页中包含的 CSS 文件。保存 CSS 文件后，更改会直接实施，无需刷新浏览器。
只需插入 javascript 文件即可！
但请注意：它仅在您将文件放在服务器上时才有效！
如果您使用 Sublime Text 和 Google Chrome 或 Apple Safari 进行开发，那么您应该使用 Emmet LiveStyle。这是一个更强大的 Live CSS-Reloader。
现在我用它来代替 CSS Refresh。
如果您想了解更多关于这个很棒的插件的信息，请阅读Post by Smashing Magazine
【讨论】：
使用 jQuery，您可以创建一个重新加载外部样式表的函数。
/**
* Forces a reload of all stylesheets by appending a unique query string
* to each stylesheet URL.
*/
function reloadStylesheets() {
var queryString = '?reload=' + new Date().getTime();
$('link[rel="stylesheet"]').each(function () {
this.href = this.href.replace(/\?.*|$/, queryString);
});
}
【讨论】：
它可以作为 OS X 和 windows 的浏览器插件使用。我喜欢它，因为我不必在我的版本控制中嵌入可能不小心提交的其他 javascript。
【讨论】：
我发现浏览器插件/扩展是最简单的解决方案。它们不需要对您的各个站点进行任何代码更改。它们可以用于网络上的任何站点——如果我快速修改内存中的内容以隐藏工具栏或临时修复错误，这将非常有用；一旦完成处理，我可以按一个键，所有的 CSS 都恢复正常。
一旦安装，（大多数）CSS 重新加载插件/扩展不会自动重新加载 CSS。但通常使用一些简单的东西，如工具栏按钮、上下文菜单项和/或简单的按键来重新加载 CSS。无论如何，我发现这种方法不太容易出错，并且比现有的一些自动化解决方案复杂得多。
一些例子（请随意提出其他一些建议）：
铬：
火狐：
【讨论】：
这是我的小项目。请尝试一下
CSS Auto reload on Github
【讨论】：
是的，您可以通过jQuery 操作CSS：
$(".classToBeReplaced").switchClass( "classToBeReplaced", "newClass", 1000 );
您也可以使用toggleClass 方法。
【讨论】：
FireFox 的 Firebug。
它是附加/单独窗口中的插件。对 HTML/CSS 的更改会立即显示，元素会突出显示。
相对于 JS hack 的优势在于您不会意外地将其复制到您的生产实例中。
【讨论】：
【讨论】：
新的开源代码编辑器brackets具有实时开发功能，您可以在编辑器中编辑 CSS，它会立即反映在 chrome 浏览器中。它目前仅适用于 CSS 编辑，但 HTML 编辑即将推出！
【讨论】：
Firebug for Firefox 是我的首选方法： https://addons.mozilla.org/de/firefox/addon/firebug/ 您可以即时编辑 HTML 和 CSS，快速停用 CSS 规则（不删除它们），添加或删除 HTML 等等。如果您不想调整您的设计，这是您的选择。您甚至可以将更改保存到本地副本，但我几乎从不使用该功能。
【讨论】：
如果您使用的是 Firefox，那么您可以从 Firefox 的附加组件安装 Web Developer Toolbar 1.2.2，该附加组件具有重新加载链接样式表的选项。
【讨论】：
尝试使用CSS Brush，这是一个用于实时创建 CSS 的 chrome 插件。您不必在文本编辑器中编写所有 CSS，返回浏览器并重新加载它，而是像在文本编辑器中一样实时编写 CSS。您将拥有比文本编辑器更多的功能，例如上下文相关菜单、使用重复属性、直接从页面选择完整的 CSS 路径或元素的过滤路径。
【讨论】：