Css 动态变色

我刚开始使用SCSS，在动态更改网站颜色方面遇到了一些问题。我想做的是创建一个颜色列表，每次我刷新页面时，它都会更改所选的颜色。代码如下：

SCSS：

---

但是，它仅在我修改文件时更改颜色，而不是在每次刷新页面时更改颜色。我该怎么办？谢谢

您的代码可以工作，但您必须在浏览器中编译SCSS文件（使用）才能看到效果

HTML:

选中此选项（要查看效果，请将文本添加到段落或刷新页面）：

---

我想你需要javascript。你在哪里编译你的SCSS文件？我要做的是：“sass watch custom.css:custom.SCSS--style compressed”它不会工作，因为你编译了你的SCSS文件，它会生成css文件。然后，当您刷新页面时，将不会创建新的CSS文件。一种方法是采用我发布的方法。@GusFulton你知道Sass只编译成CSS，对吗？你要求的是浏览器本身理解Sass。我也这么做。我在终端中使用“sass watch custom.css:custom.scss--style compressed”进行编译，但仍然没有更改。请查看您帖子下方的评论。如何使用sass.js编译文件？Codepen不使用sass.js。每次您请求页面或修改代码时，它都会在服务器上进行编译，然后提供已编译的CSS。我知道，我不是这方面的专家，但我认为您可以在某种程度上使用sass.js获得与Codepen类似的结果（不是在每次请求时，而是在刷新时）。

$colors: (
      #cc6698,
      #0869ad,
      #ff8300,
      #7A86b8,
      #f05133,
      #2aa9e0,
      #71bf45,
      #ef0e39,
      #9e79d7,
    );

    $color: nth($colors, random(length($colors)));

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor maiores placeat illo culpa quam, magnam sunt accusantium enim dicta temporibus, reiciendis soluta iure, reprehenderit qui vel perspiciatis suscipit earum asperiores.</p>

$colors: (
  #cc6698,
  #0869ad,
  #ff8300,
  #7A86b8,
  #f05133,
  #2aa9e0,
  #71bf45,
  #ef0e39,
  #9e79d7,
);

$color: nth($colors, random(length($colors)));

body {
  color: $color;
}