* feat(tools): add seed/solution restore script * chore(curriculum): remove empty sections' markers * chore(curriculum): add seed + solution to Chinese * chore: remove old formatter * fix: update getChallenges parse translated challenges separately, without reference to the source * chore(curriculum): add dashedName to English * chore(curriculum): add dashedName to Chinese * refactor: remove unused challenge property 'name' * fix: relax dashedName requirement * fix: stray tag Remove stray `pre` tag from challenge file. Signed-off-by: nhcarrigan <nhcarrigan@gmail.com> Co-authored-by: nhcarrigan <nhcarrigan@gmail.com>
1.5 KiB
1.5 KiB
id, title, challengeType, videoUrl, forumTopicId, dashedName
id | title | challengeType | videoUrl | forumTopicId | dashedName |
---|---|---|---|---|---|
587d781e367417b2b2512aca | 使用 CSS 偏移移动相对定位的元素 | 0 | https://scrimba.com/c/c9bQEA4 | 301065 | move-a-relatively-positioned-element-with-css-offsets |
--description--
CSS 里面的 top
、bottom
、left
和 right
定义了元素在相应方位的偏移距离。元素将从当前位置向属性相反的方向偏移。就像你在上一个挑战看到的,top
属性使 h2
向下移动。left
属性使元素向右移动。

--instructions--
请通过 CSS 属性把 h2
向上移动 10 像素,向右移动 15 像素。
--hints--
应使用 CSS 属性使 h2
相对当前位置向上移动 10px
。也就是说,从 h2
当前位置远离 bottom
10px
。
assert($('h2').css('bottom') == '10px');
应使用 CSS 属性使 h2
相对当前位置向右移动 15px
。也就是说,从 h2
当前位置远离 left
15px
。
assert($('h2').css('left') == '15px');
--seed--
--seed-contents--
<head>
<style>
h2 {
position: relative;
}
</style>
</head>
<body>
<h1>On Being Well-Positioned</h1>
<h2>Move me!</h2>
<p>I still think the h2 is where it normally sits.</p>
</body>
--solutions--
<head>
<style>
h2 {
position: relative;
left: 15px;
bottom: 10px;
}
</style>
</head>
<body>
<h1>On Being Well-Positioned</h1>
<h2>Move me!</h2>
<p>I still think the h2 is where it normally sits.</p>
</body>