CSS တွင် ဖြတ်ထားသော အရာများအတွက် ဒေါင်လိုက်အကွာအဝေး

ယခုတွင် ဒေါင်လိုက်အကွာအဝေးများကို ထည့်ကြည့်ပါစို့။ ဤသို့ပြုလုပ်ရန် သားစဉ်မြေးဆက်အားလုံးကို margin-bottom တန်ဖိုးအဖြစ် 10px သတ်မှတ်ပေးပါမည်။

html<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  <div class="child">3</div>
  <div class="child">4</div>
  <div class="child">5</div>
  <div class="child">6</div>
  <div class="child">7</div>
  <div class="child">8</div>
</div>
css.parent {
  display: flex;
  flex-wrap: wrap;
  width: 320px;
  border: 1px solid red;
}
.child {
  box-sizing: border-box;
  width: 100px;
  height: 100px;
  margin-right: 10px;
  margin-bottom: 10px;
  border: 1px solid green;
}
.child:nth-child(3n) {
  margin-right: 0;
}

Результат:

ကျွန်ုပ်တို့မြင်ရသည့်အတိုင်း၊ နောက်ဆုံးအတန်းသည် မိဘထံမှ ကွာခြားနေခြင်းမှလွဲ၍ အားလုံးကောင်းမွန်စွာ လုပ်ဆောင်ပါသည်။ များသောအားဖြင့် ဤအရာသည် အရေးမကြီးပါ။

Задание 1

အရာဝတ္ထုများအကြား အကွာအဝေး 20px ဖြင့် တစ်တန်းလျှင် အရာနှစ်ခုပါသော ဖြတ်ထားသည့် အရာတစ်ခုကို ပြုလုပ်ပါ။

Задание 2

အရာဝတ္ထုများအကြား အကွာအဝေး 20px ဖြင့် တစ်တန်းလျှင် အရာသုံးခုပါသော ဖြတ်ထားသည့် အရာတစ်ခုကို ပြုလုပ်ပါ။

Задание 3

အရာဝတ္ထုများအကြား အကွာအဝေး 20px ဖြင့် တစ်တန်းလျှင် အရာလေးခုပါသော ဖြတ်ထားသည့် အရာတစ်ခုကို ပြုလုပ်ပါ။