2.0 KiB
2.0 KiB
id | challengeType | videoUrl | forumTopicId | title |
---|---|---|---|---|
5b7d72c338cd7e35b63f3e14 | 0 | 301087 | 通过浏览器降级提高兼容性 |
Description
Instructions
.red-box
class 的背景色。来通过在存在的声明前添加其它的值为 red 的 background
声明来提高浏览器的兼容性。
Tests
tests:
- text: '<code>.red-box</code> 应该通过在存在的 <code>background</code> 声明前添加其它的值为 red 的<code>background</code> 来提供降级。'
testString: assert(code.replace(/\s/g, "").match(/\.red-box{background:(red|#ff0000|#f00|rgb\(255,0,0\)|rgb\(100%,0%,0%\)|hsl\(0,100%,50%\));background:var\(--red-color\);height:200px;width:200px;}/gi));
Challenge Seed
<style>
:root {
--red-color: red;
}
.red-box {
background: var(--red-color);
height: 200px;
width:200px;
}
</style>
<div class="red-box"></div>
Solution
<style>
:root {
--red-color: red;
}
.red-box {
background: red;
background: var(--red-color);
height: 200px;
width:200px;
}
</style>
<div class="red-box"></div>