Skip to main content
DevTools24

CSS Grid जनरेटर

CSS Grid लेआउट बनाएं।

1
2
3
4
5
6
.container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  column-gap: 10px;
  row-gap: 10px;
  justify-items: stretch;
  align-items: stretch;
}

CSS Grid Layout - तकनीकी विवरण

CSS Grid is a two-dimensional layout system for the web. Define rows and columns with grid-template-rows and grid-template-columns. Use fr units for flexible sizing, repeat() for patterns, and gap for spacing between cells.

कमांड-लाइन विकल्प

/* Common grid patterns */\n.container {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n}

संदर्भ

आधिकारिक स्पेसिफिकेशन देखें