టేబుల్-హెడర్ గ్రూప్ అంటే ఏమిటి?
CSS లో, ' టేబుల్-హెడర్ గ్రూప్ '' ద్వారా పట్టిక యొక్క శీర్షికను ప్రదర్శించడానికి ఉపయోగించబడుతుంది ” ట్యాగ్. హెడర్ నిలువు నిలువు వరుసలోని మొదటి ఎంట్రీకి అనుగుణంగా ఉంటుంది. ఇది టేబుల్ ఎంట్రీల గురించి సమాచారాన్ని నిర్దేశిస్తుంది. అవసరమైతే హెడర్ బహుళ నిలువు వరుసలను కూడా విస్తరించవచ్చు. CSSలో టేబుల్-కాలమ్ సమూహాన్ని సృష్టించడం ద్వారా దీన్ని నిర్వహించవచ్చు.
ఉదాహరణ పట్టిక-హెడర్ను ఎలా సృష్టించాలో క్రింది దశలు వివరిస్తాయి: అవుట్పుట్ ది ' టేబుల్-ఫుటర్ గ్రూప్ '' సహాయంతో CSSలో పట్టిక యొక్క ఫుటర్ను ప్రదర్శించడానికి ఉపయోగించబడుతుంది ” ట్యాగ్. డేటాను మరింత స్పష్టంగా అర్థం చేసుకోవడంలో పాఠకులకు సహాయపడే టేబుల్ కంటెంట్ గురించి కూడా ఫూటర్ సమాచారాన్ని అందిస్తుంది. మునుపటి భాగం నుండి అదే ఉదాహరణను ఉపయోగించి, పట్టికలోని 'పురుషులు' మరియు 'మహిళలు' కోసం ప్రతి నిలువు వరుసలో మొత్తం ఎంట్రీల సంఖ్యను అందించే ఫుటర్ను జోడించండి. ఉదాహరణ కింది దశలు టేబుల్-ఫుటర్ని సృష్టించే దశలను వివరిస్తాయి: అవుట్పుట్ CSSలోని పట్టికలోని హెడర్ మరియు ఫుటర్ వరుసగా పట్టిక ఎగువన మరియు దిగువన మరింత సమాచారాన్ని జోడించడంలో సహాయపడతాయి. ఈ సమాచారం పట్టిక దేనికి సంబంధించినదో గుర్తించడంలో సహాయపడుతుంది మరియు పట్టికలో చొప్పించిన విలువలలోని మరిన్ని వివరాలను అందిస్తుంది. ఈ రెండూ కలిసి, టేబుల్లో కప్పబడిన డేటాను ఖచ్చితంగా ఫ్రేమ్ చేస్తాయి.
పట్టిక యొక్క శీర్షిక దానిని దృశ్యమానంగా వేరు చేయడానికి పట్టికలోని మిగిలిన ఎంట్రీల నుండి భిన్నమైన ఫార్మాటింగ్ను కలిగి ఉంది. ఇవి సాధారణంగా బోల్డ్ ఫాంట్ పరిమాణం లేదా ఎగువ-స్థాయి వచనం ద్వారా సూచించబడతాయి. 'పురుషులు' మరియు 'మహిళలు' పేర్లను జాబితా చేస్తున్నప్పుడు, దిగువ ఉదాహరణలో చూపిన విధంగా మేము వాటిని ప్రత్యేక వరుసలో శీర్షికలుగా కేటాయించవచ్చు:
< పట్టిక >
< తల >
< tr >
< వ > పురుషులు < / వ >
< వ > స్త్రీలు < / వ >
< / tr >
< / తల >
< శరీరం >
< tr >
< td > జేమ్స్ < / td >
< td > జెస్సికా < / td >
< / tr >
< tr >
< td > డేవిడ్ < / td >
< td > లారా < / td >
< / tr >
< tr >
< td > జాకబ్ < / td >
< td > రెబెక్కా < / td >
< / tr >
< / శరీరం >
< / పట్టిక >
” ట్యాగ్ ద్వారా హెడర్ విలువలను వరుసగా జోడించండి మరియు “ ” ట్యాగ్ని ఉపయోగించి ప్రతి అడ్డు వరుసలకు డేటాను చొప్పించండి.
టేబుల్-ఫుటర్ గ్రూప్ అంటే ఏమిటి?
చర్చించబడిన భావనను వివరించే క్రింది ఉదాహరణ యొక్క అవలోకనం:
< తల >
< tr >
< వ >పురుషులు< / వ >
< వ > స్త్రీలు< / వ >
< / tr >
< / తల >
< శరీరం >
< tr >
< td >జేమ్స్ < / td >
< td >జెస్సికా< / td >
< / tr >
< tr >
< td >డేవిడ్< / td >
< td >లారా< / td >
< / tr >
< tr >
< td > జాకబ్ < / td >
< td >రెబెక్కా< / td >
< / tr >
< / శరీరం >
< tfoot >
< tr >
< td తరగతి = 'bg-గ్రే-200' >మొత్తం 03< / td >
< td తరగతి = 'bg-గ్రే-200' >మొత్తం 03< / td >
< / tr >
< / tfoot >
< / పట్టిక >
పైన వ్రాసిన కోడ్ క్రింది ఫలితాన్ని ఉత్పత్తి చేస్తుంది: ముగింపు