Middle

Kui palju olete CSS-iga töötanud? Kas teate Grid Layouti?

sobes.tech AI

Vastus AI-lt

Olen üsna sageli töötanud CSS-iga, sealhulgas kasutades Grid Layouti keerukate ja reageerivate paigutuste loomiseks. CSS Grid on võimas tööriist kahe mõõtmelise võrgustiku loomiseks, mis võimaldab hõlpsasti hallata elementide paigutust ridades ja veergudes.

Lihtne näide Grid Layoutist:

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

HTML-s:

<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>

See loob võrgustiku, millel on 3 veergu ja 2 rida, ühtlase jaotusega elementide vahel. Grid Layout on kasulik keerukate ja paindlike kasutajaliideste loomisel, ilma float või flexbox kasutamata.

Eelmine Edasi