వివరణ జాబితా నిబంధనలు మరియు వాటి సంబంధిత వివరణల మధ్య సంబంధాన్ని సృష్టించే సమాచారాన్ని రూపొందించడానికి మరియు అందించడానికి అర్థ మార్గాన్ని అందిస్తుంది. ఇది డేటా లేదా సమాచారాన్ని మరింత ప్రాప్యత మరియు అర్థమయ్యేలా చేస్తుంది. సృష్టికర్తలు గ్లాసరీలు, నిఘంటువులు, తరచుగా అడిగే ప్రశ్నలు విభాగాలు, ఉత్పత్తి వివరణలు మొదలైన ప్రదేశాలలో వివరణ జాబితాలను ఉపయోగించుకోవచ్చు. ఈ కథనం HTMLలో వివరణ జాబితాను ఉపయోగించే విధానాన్ని ప్రదర్శిస్తుంది.
HTMLలో వివరణ జాబితాను ఎలా ఉపయోగించాలి?
వివరణ జాబితాలో ' ',' ', మరియు' ” ట్యాగ్‌లు మరియు ఇది నిబంధనల సేకరణ మరియు వాటి సంబంధిత నిర్వచనాలను సూచించడానికి ఉపయోగించబడుతుంది. ఇది సాధారణ బుల్లెట్-పాయింట్ జాబితాకు మించిన వివరణను నిర్మాణాత్మక రూపంలో కంటెంట్‌ను ప్రదర్శిస్తుంది/ప్రదర్శిస్తుంది. దృశ్యమానంగా ఆకట్టుకునే ఇంటర్‌ఫేస్‌ను రూపొందించడానికి CSS లక్షణాలను వివరణ జాబితాకు కూడా వర్తింపజేయవచ్చు.
HTMLలో వివరణ జాబితాను రూపొందించడానికి క్రింది కోడ్ స్నిప్పెట్‌ని సందర్శించండి:
< శరీరం >
< div >
< h2 > ల్యాప్‌టాప్ మార్కెట్ షేర్లు h2 >
< dl >
< dt > Hp dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 30 % dd >
< dt > డెల్ dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 24 % dd >
< dt > లెనోవా dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 14 % dd >
dl >
div >
శరీరం >
పై కోడ్ స్నిప్పెట్ యొక్క వివరణ:
-
- మొదట, తల్లిదండ్రులు ' div వివరణ జాబితా మూలకం మరియు ఇతర HTML మూలకాల కోసం ఒక కంటైనర్ వలె పని చేసే మూలకం సృష్టించబడింది ”.
- తరువాత, వివరణ జాబితా '
- అప్పుడు, వివరణ పేరు/పదం ' ” ట్యాగ్ జోడించబడబోయే వివరణను నిర్వచించడానికి ఉపయోగించబడుతుంది.
- ఆ తరువాత, వివరణ డేటా ' ” ట్యాగ్ చొప్పించబడింది, ఇందులో వివరణ అంశానికి సంబంధించిన వివరణ/సమాచారం ఉంటుంది.
సంకలన దశ ముగిసిన తర్వాత, HTML అంశాలు వెబ్‌పేజీలో ఇలా కనిపిస్తాయి:
వివరణ జాబితా రూపొందించబడిందని అవుట్‌పుట్ చూపుతుంది.
ఉదాహరణ 1: ఒకే పదానికి బహుళ వివరణలను కేటాయించండి
వివరణ పట్టికను సృష్టించవచ్చు, దీనిలో ఒకే పదానికి ఒకటి కంటే ఎక్కువ వివరణలు ఉంటాయి. వర్ణన పదాన్ని వివరించడానికి ఒకటి కంటే ఎక్కువ అర్థాలు లేదా పద్ధతులు ఉంటే ఇది చాలా ఉపయోగకరంగా ఉంటుంది.
పై దృశ్యం కోసం కోడ్ క్రింద చూపబడింది:
< div >< h2 > ల్యాప్‌టాప్ మార్కెట్ షేర్లు h2 >
< dl >
< dt > Hp dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 30 % లో 2018 dd >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 23 % లో 2017 dd >
< dt > డెల్ dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 24 % లో 2018 dd >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 27 % లో 2017 dd >
< dt > లెనోవా dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 14 % లో 2018 మరియు 9 % లో 2017 dd >
dl >
div >
పై కోడ్‌లో:
-
- మొదట, వివరణ జాబితా సహాయంతో సృష్టించబడుతుంది ' dl ',' dt 'మరియు' dd ”మూలకాలు.
- తరువాత, బహుళ ' 'ట్యాగ్‌లు ఒకే' కింద ఉపయోగించబడతాయి dt ' మూలకం. ఇది ఒకే పదానికి బహుళ వివరణలను కేటాయిస్తుంది.
సంకలన దశ తర్వాత:
ఒకే పదం కోసం బహుళ వివరణలు జోడించబడినట్లు అవుట్‌పుట్ చూపిస్తుంది.
ఉదాహరణ 2: ఒకే వివరణకు బహుళ నిబంధనలను కేటాయించండి
డెవలపర్‌లు ఒకే వివరణ డేటాతో బహుళ వివరణ పదాలను కలిగి ఉన్న వివరణ జాబితాను కూడా సృష్టించవచ్చు. బహుళ పదాలు సారూప్యంగా లేదా ఒకే కార్యాచరణను కలిగి ఉన్నప్పుడు ఇది ప్రత్యేకంగా ఉపయోగపడుతుంది. ఈ సాంకేతికతను ఉపయోగించడం ద్వారా, ఈ నిబంధనలన్నింటినీ ఒకేసారి వివరించవచ్చు:
< div శైలి = 'మార్జిన్: 20px' >< h2 > ల్యాప్‌టాప్ మార్కెట్ షేర్లు h2 >
< dl >
< dt > Hp dt >
< dt > ఎలైట్బుక్ dt >
< dt > ప్రోబుక్ dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 30 % లో 2018 dd >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 23 % లో 2017 dd >
< dt > లెనోవా dt >
< dd > డెస్క్‌టాప్ సిస్టమ్‌లు మరియు ల్యాప్‌టాప్‌ల వర్గంలో వాటా ఉంది 14 % లో 2018 మరియు 9 % లో 2017 dd >
dl >
div >
ఎగువ కోడ్ బ్లాక్‌లో, వివరణ జాబితా సృష్టించబడింది మరియు బహుళ “ 'ట్యాగ్‌లు ఒకే'తో ఉపయోగించబడతాయి ” ట్యాగ్.
సంకలన దశ ముగిసిన తర్వాత:
పై స్నాప్‌షాట్ ఒకే వివరణ డేటాతో బహుళ నిబంధనలు కేటాయించబడిందని చూపిస్తుంది.
ముగింపు
వివరణ జాబితాను ఉపయోగించి వివరణ జాబితా సృష్టించబడింది ' ” ట్యాగ్ జాబితా అంశాలు మరియు వాటి వివరణ కోసం కంటైనర్‌ను సృష్టిస్తుంది. ఇంకా, ' ” ట్యాగ్ వివరణ అందించబడబోయే అంశం పేరును సూచిస్తుంది. అయితే ' ” ట్యాగ్ సంబంధిత వివరణను నిల్వ చేస్తుంది. ఈ కథనం HTMLలో వివరణ జాబితా యొక్క వినియోగాన్ని ప్రదర్శించింది.