HTML5 SECTION ఎలిమెంట్ ను గ్రహించుట
అనేక సంవత్సరాల క్రితం సన్నివేశాలలో HTML5 పగిలిపోయినప్పుడు, ఇది SECTION మూలకంతో సహా, లాంగ్వేజ్కు కొత్త విభాగీకరణ మూలకాల యొక్క కొంతభాగాన్ని జోడించారు. HTML5 పరిచయం చేసే కొత్త అంశాల్లో స్పష్టమైన ఉపయోగాలున్నాయి. ఉదాహరణకు, మూలకం ఒక వ్యాసాలను మరియు వెబ్ పేజీ యొక్క ప్రధాన భాగాలను నిర్వచించడానికి ఉపయోగించబడుతుంది, మిగిలిన అంశానికి క్లిష్టమైనది కాదు మరియు శీర్షిక, nav మరియు ఫుటరు అనేవి సంబంధిత స్వీయ-వివరణాత్మకమైనవి. కొత్తగా జోడించిన SECTION మూలకం, అయితే, ఒక బిట్ తక్కువ స్పష్టమైన ఉంది.
HTML మూలకాలు SECTION అని చాలామంది నమ్ముతారు మరియు వెబ్ పుటలోని కంటెంట్ను కలిగి ఉండటానికి వాడే ఇదే సాధారణ-సాధారణ కంటైనర్ మూలకాలు. రియాలిటీ, అయితే, ఈ రెండు అంశాలు, రెండు కంటైనర్ మూలకాలు ఉండగా, కానీ సాధారణ ఉన్నాయి. SECTION మూలకం మరియు DIV మూలకం రెండింటినీ ఉపయోగించడానికి నిర్దిష్ట కారణాలు ఉన్నాయి - మరియు ఈ వ్యాసం ఆ తేడాలు వివరిస్తుంది.
విభాగాలు మరియు విభాగాలు
SECTION ఎలిమెంట్ ఒక వెబ్ పేజీ లేదా సైట్ యొక్క సెమాంటిక్ సెక్షన్గా నిర్వచించబడింది, ఇది మరొక నిర్దిష్ట రకం (వ్యాసం లేదా పక్కన) కాదు. నేను పేజీ యొక్క ప్రత్యేకమైన విభాగాన్ని గుర్తించేటప్పుడు ఈ మూలకాన్ని ఉపయోగించుకుంటాను - టోకుని తరలించి, ఇతర పేజీలలో లేదా సైట్ యొక్క భాగాలలో ఉపయోగించబడే ఒక విభాగం. మీరు కావాలనుకుంటే ఇది కంటెంట్ యొక్క ప్రత్యేకమైన భాగాన్ని లేదా కంటెంట్ యొక్క "విభాగం".
దీనికి విరుద్ధంగా, మీరు DIV ని వాడాలి పేజీ యొక్క భాగాల కోసం మీరు విభజించాలనుకుంటున్న, కానీ సెమాంటిక్స్ కంటే ఇతర ప్రయోజనాల కోసం. నేను CSS తో ఉపయోగించడానికి ఒక "హుక్" ఇవ్వాలని పూర్తిగా చేస్తున్న ఉంటే నేను ఒక విభాగంలో కంటెంట్ ప్రాంతం మూసివేయాలని ఉంటుంది. ఇది సెమాంటిక్స్పై ఆధారపడిన కంటెంట్ యొక్క ప్రత్యేక విభాగంగా ఉండకపోవచ్చు, కానీ నా పేజీకి కావలసిన లేఅవుట్ను సాధించడానికి నేను ఆధ్వర్యంలో ఉంటాను.
ఇది అన్ని సెమంటిక్స్ గురించి
ఇది అర్థం చేసుకోవడానికి ఒక కఠినమైన భావన, కానీ DIV మూలకం మరియు SECTION మూలకం మధ్య ఒకే ఒక వ్యత్యాసం సెమాంటిక్స్. మరో మాటలో చెప్పాలంటే, మీరు విభజన చేస్తున్న కోడ్ యొక్క విభాగం యొక్క అర్ధం .
ఒక DIV మూలకం లోపల ఉన్న ఏదైనా కంటెంట్ ఏ స్వాభావిక అర్థాన్ని కలిగి లేదు. ఇది వంటి విషయాలను ఉత్తమంగా ఉపయోగిస్తారు:
- CSS శైలులను CSS శైలులు మరియు hooks
- లేఅవుట్ కంటైనర్లు
- JavaScript హుక్స్
- సులభంగా చదవడానికి HTML కోసం విభాగాలు
DIV మూలకం మా పత్రాలను శైలి మాదిరిగా హుక్స్ని జోడించడం మరియు నిలువు మరియు ఫాన్సీ లేఅవుట్లు సృష్టించడానికి మాత్రమే మూలకం ఉండేది. ఆ కారణంగా, మేము HTML తో ముగించారు DIV మూలకాలు - వెబ్ డిజైనర్లు "డివిటిస్." అని పిలుస్తారు ఉండవచ్చు DIV ఉపయోగించిన WYSIWYG సంపాదకులు కూడా ఉన్నాయి ప్రత్యేకంగా మూలకం. నేను నిజానికి ఉపయోగించే HTML అంతటా అమలు చేస్తాము DIV బదులుగా పేరాలు కోసం మూలకం!
HTML5 తో, మేము మరింత సెమాంటిక్ వివరణాత్మక పత్రాలను (పేజీకి సంబంధించిన లింకులు కోసం మరియు వివరణాత్మక సంఖ్యలు కోసం మరియు అందువలన న) సృష్టించడానికి మరియు ఆ అంశాలపై శైలులను నిర్వచించడానికి సెక్షన్ ఎలిమెంట్లను ఉపయోగించడం ప్రారంభించవచ్చు.
SPAN ఎలిమెంట్ గురించి ఏమిటి?
చాలామంది ప్రజలు భావించే ఇతర మూలకం DIV మూలకం యొక్క మూలకం. DIV వంటి ఈ మూలకం ఒక అర్థ మూలకం కాదు. ఇది కంటెంట్ ఇన్లైన్ బ్లాక్స్ (సాధారణంగా టెక్స్ట్) చుట్టూ శైలులు మరియు స్క్రిప్ట్లు కోసం హుక్స్లను జోడించడానికి మీరు ఉపయోగించే ఇన్లైన్ మూలకం. ఆ కోణంలో ఇది సరిగ్గా DIV మూలకం, కేవలం బ్లాక్ మూలకాన్ని కాకుండా ఇన్లైన్. కొన్ని మార్గాల్లో, ఇది DIV యొక్క బ్లాక్-లెవల్ SPAN మూలకంలా ఆలోచించడం సులభం కావచ్చు మరియు HTML కంటెంట్ మొత్తం బ్లాక్స్ కోసం మాత్రమే SPAN చేస్తాను.
HTML5 లో పోల్చదగిన ఇన్లైన్ విభాగీకరణ మూలకం లేదు.
ఇంటర్నెట్ ఎక్స్ప్లోరర్ యొక్క పాత సంస్కరణల కోసం
మీరు విశ్వసనీయంగా HTML5 గుర్తించని IE యొక్క నాటకీయంగా పాత సంస్కరణలు (IE 8 మరియు తక్కువ వంటివి) మద్దతు ఇస్తే, మీరు సెమాంటిక్ సరైన HTML ట్యాగ్లను ఉపయోగించడానికి బయపడకండి. సెమాంటిక్స్ మీకు మరియు మీ బృందం భవిష్యత్తులో పేజీని నిర్వహించడంలో సహాయపడుతుంది (ARTICLE మూలకం చుట్టూ ఉన్నట్లయితే ఆ విభాగాన్ని వ్యాసం అని మీకు తెలుసు). అదనంగా, ఆ ట్యాగ్లను గుర్తించే బ్రౌజర్లు వాటిని ఉత్తమంగా సమర్ధించగలవు.
మీరు ఇంకా ఇంటర్నెట్ ఎక్స్ప్లోరర్ తో HTML5 అర్థ విభాగీకరణ అంశాలను ఉపయోగించవచ్చు, మీరు స్క్రిప్ట్ మరియు కొన్ని పరిసర DIV ఎలిమెంట్లను HTML గా టాగ్లను గుర్తించడం కోసం వాటిని జోడించాలి.
DIV మరియు SECTION ఎలిమెంట్స్ ఉపయోగించి
మీరు వాటిని సరిగ్గా వాడుతుంటే, మీరు చెల్లుబాటు అయ్యే HTML5 డాక్యుమెంట్లో కలిసి DIV మరియు SECTION ఎలిమెంట్లను ఉపయోగించవచ్చు. మీరు ఈ వ్యాసంలో చూసినట్లుగా, మీరు కంటెంట్ యొక్క అర్థవివరణ వివిక్త భాగాలను నిర్వచించడానికి SECTION మూలకాన్ని ఉపయోగిస్తారు మరియు మీరు DIV ను CSS మరియు జావాస్క్రిప్ట్లకు హుక్స్గా అలాగే ఒక సెమాంటిక్ అర్ధం లేని లేఅవుట్ను నిర్వచించేలా ఉపయోగిస్తారు.
జెన్నిఫర్ క్రిన్ని రచించిన అసలు వ్యాసం. జెరెమీ గిరార్డ్ 3/15/17 న సవరించబడింది