id	title	challengeType	forumTopicId
587d7dbd367417b2b2512bb4	用 Sass 变量存储数据	0	301460

--description--

Sass 不同于 CSS 的一个特点是它允许使用变量。我们可以在 Sass 中声明变量，并为它赋值，就像我们在 JavaScript 中一样。

在 JavaScript 中，变量是使用let和const关键字定义的。在 Sass 中，变量以$开头的，后跟变量名。

这里有几个例子：

$main-fonts: Arial, sans-serif;
$headings-color: green;

//To use variables:
h1 {
  font-family: $main-fonts;
  color: $headings-color;
}

当需要把多个元素设置成相同颜色时，变量就会很有用。一旦我们需要更改颜色，只需要改变这个变量的值就好。

--instructions--

创建一个变量$text-color并将其设置为红色。然后更改.blog-post和h2的color属性的值为$text-color变量。

你应该为$text-color声明一个值为红色的 Sass 变量。

assert(code.match(/\$text-color:\s*?red;/g));

你应使用$text-color变量来更改.blog-post和h2的颜色。

assert(code.match(/color:\s*?\$text-color;/g));

.blog-post元素应为红色。

assert($('.blog-post').css('color') == 'rgb(255, 0, 0)');

h2元素应为红色。

assert($('h2').css('color') == 'rgb(255, 0, 0)');