freeCodeCamp/add-different-margins-to-each-side-of-an-element.chinese.md at 4f32fedb8ef314c6004d7e9285ae61731c4e2136

Files

Zhicheng Chen 4f32fedb8e fix(i18n): update review suggestion

2020-02-11 15:42:42 +09:00

2.4 KiB

Raw Blame History

id, title, challengeType, videoUrl, forumTopicId, localeTitle

id	title	challengeType	videoUrl	forumTopicId	localeTitle
bad87fee1248bd9aedf08824	Add Different Margins to Each Side of an Element	0	https://scrimba.com/c/cg4RWh4	16633	给元素的每一侧添加不同的外边距

Description

有时候，你会想给一个元素每个方向的margin都设置成一个特定的值。 CSS 允许你使用margin-top，margin-right，margin-bottom和margin-left属性来设置四个不同方向的margin值。

Instructions

蓝色框的顶部和左侧的margin值设置为40px，底部和右侧设置为20px。

Tests

tests:
  - text: '<code>blue-box</code> class 的右侧<code>margin</code>（上外边距）值应为<code>40px</code>。'
    testString: assert($(".blue-box").css("margin-top") === "40px");
  - text: '<code>blue-box</code> class 的右侧<code>margin</code>（右外边距）值应为<code>20px</code>。'
    testString: assert($(".blue-box").css("margin-right") === "20px");
  - text: '<code>blue-box</code> class 的底部<code>margin</code>（下外边距）值应为<code>20px</code>。'
    testString: assert($(".blue-box").css("margin-bottom") === "20px");
  - text: '<code>blue-box</code> class 的左侧<code>margin</code>（左外边距）值应为<code>40px</code>。'
    testString: assert($(".blue-box").css("margin-left") === "40px");

Challenge Seed

<style>
  .injected-text {
    margin-bottom: -25px;
    text-align: center;
  }

  .box {
    border-style: solid;
    border-color: black;
    border-width: 5px;
    text-align: center;
  }

  .yellow-box {
    background-color: yellow;
    padding: 10px;
  }
  
  .red-box {
    background-color: crimson;
    color: #fff;
    margin-top: 40px;
    margin-right: 20px;
    margin-bottom: 20px;
    margin-left: 40px;
  }

  .blue-box {
    background-color: blue;
    color: #fff;
  }
</style>
<h5 class="injected-text">margin</h5>

<div class="box yellow-box">
  <h5 class="box red-box">padding</h5>
  <h5 class="box blue-box">padding</h5>
</div>

Solution

// solution required

2.4 KiB Raw Blame History Unescape Escape