Middle

CSS bilan ishlashda qanchalik tanishsiz? Grid Layout bilan tanishmisiz?

sobes.tech AI

AIdan javob

Men CSS bilan juda ko'p ishlaganman, jumladan murakkab moslashuvchan maketlar yaratish uchun Grid Layoutdan foydalanishni ham. CSS Grid ikki o'lchovli tarmoq yaratish uchun kuchli vositadir, u elementlarning satrlar va ustunlar bo'yicha joylashishini oson boshqarishga imkon beradi.

Oddiy Grid Layout misoli:

.container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
}
.item {
  background-color: #ccc;
  padding: 20px;
  text-align: center;
}

HTMLda:

<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
  <div class="item">5</div>
  <div class="item">6</div>
</div>

Bu, 3 ustun va 2 satrli tarmoq yaratadi, elementlar teng taqsimlangan. Grid Layout murakkab va moslashuvchan interfeyslar yaratishda foydalidir, float yoki flexboxdan foydalanmasdan.

Oldingi Keyingi