CSS grid-template-rows అట్రిబ్యూట్
- పూర్వ పేజీ grid-template-columns
- తదుపరి పేజీ హ్యాంగింగ్ పంక్ట్యూషన్
నిర్వచనం మరియు ఉపయోగం
grid-template-rows గ్రిడ్ లేఆఉట్ లో పంక్తుల సంఖ్యను (మరియు పొడవును) నిర్ధారిస్తుంది.
విలువలు అంతరాయంలో వేరుచేయబడిన జాబితాలు. ప్రతి విలువ ప్రతి పంక్తి పొడవును నిర్ణయిస్తుంది.
మరింత సందర్శించండి:
CSS శిక్షణాత్మక మాలయాపనంCSS గ్రిడ్ లేఆఉట్
CSS సందర్శనాత్మక మాలయాపనంgrid-columns లక్షణం
CSS సందర్శనాత్మక మాలయాపనంgrid-template లక్షణం
ఉదాహరణ
పంక్తి పరిమాణాన్ని (పొడవు) నిర్ధారించండి:
.grid-container { display: grid; grid-template-rows: 100px 300px; }
CSS సంకేతబద్ధత
grid-template-rows: none|auto|max-content|min-content|length|initial|inherit;
లక్షణపు విలువ
విలువ | వివరణ |
---|---|
none | పరిమాణం సెట్ చేయబడలేదు. అవసరమైనప్పుడు పంక్తులను సృష్టించండి. |
auto | పంక్తుల పరిమాణం కంటైనర్ పరిమాణం మరియు పంక్తిలో అంశాల పరిమాణం ఆధారంగా నిర్ణయించబడుతుంది. |
max-content | ప్రతి పంక్తిలోని పెద్దతమ అంశం ప్రకారం పంక్తుల పరిమాణాన్ని నిర్ణయించండి. |
min-content | ప్రతి పంక్తిలోని చిన్నతమ అంశం ప్రకారం పంక్తుల పరిమాణాన్ని నిర్ణయించండి. |
length | పరిమాణాన్ని అమర్చడానికి రాశి పొడవులను ఉపయోగించండి. దయచేసి ఈ ప్రకారం సందర్శించండి:పొడవు ఇకానా。 |
సాంకేతిక వివరాలు
మూల విలువ | none |
---|---|
పారంత్రికత | లేదు |
అనిమేషన్ తయారీ: | మద్దతు ఉంది. దయచేసి ఈ ప్రకారం సందర్శించండి:అనిమేషన్ సంబంధిత లక్షణాలు。 |
వెర్షన్: | CSS Grid Layout Module Level 1 |
జావాస్క్రిప్ట్ సంకేతబద్ధత | object.style.gridTemplateRows="50px 200px" |
బ్రౌజర్ మద్దతు
పట్టికలోని సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇస్తున్న మొదటి బ్రౌజర్ వెర్షన్ ను సూచిస్తాయి.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
57 | 16 | 52 | 10 | 44 |
- పూర్వ పేజీ grid-template-columns
- తదుపరి పేజీ హ్యాంగింగ్ పంక్ట్యూషన్