4-3 RGB颜色函数-Red()、Green()、Blue()函数
本节编程练习不计算学习进度,请电脑登录imooc.com操作

RGB颜色函数-Red()、Green()、Blue()函数

3、Red() 函数

red() 函数非常简单,其主要用来获取一个颜色当中的红色值。假设有一个 #f36 的颜色,如果你想得到 #f36 中的 red 值是多少,这个时候使用 red() 函数就能很简单获取。

>> red(#f36)
255

得到的值是”255”。(注意:在命令终端要先输入sass -i 命令)

4、Green() 函数

green() 函数和 red() 函数一样,用来获取某一个颜色值中 green 的值。同样拿 ”#f36“ 颜色为例:

>> green(#f36)
51

5、Blue() 函数

同理,blue() 函数是用来获取某一个颜色值中 blue 的值,如:

>> blue(#f36)
102

 

任务

在编辑器第4行和第7行输入正确代码,当颜色的红色值大于50使用白色,当红色值小于50使用黑色

  1. $color: #f36;
  2.  
  3. .body {
  4. @if ? > 50 {
  5. color: #fff;
  6. }
  7. @else if ? < 50 {
  8. color:#000;
  9. }
  10. }
下一节