HTML వైట్‌స్పేస్‌ను సృష్టించండి

విషయము

• CSS తో HTML లో ఖాళీలు మరియు మూలకాల యొక్క భౌతిక విభజనను సృష్టించండి
• CSS తో HTML లో ఖాళీలు
• మీ టెక్స్ట్ లోపల HTML లోని ఖాళీలు
• HTML లో అంతరం ఎందుకు చెడ్డ ఆలోచన

CSS తో HTML లో ఖాళీలు మరియు మూలకాల యొక్క భౌతిక విభజనను సృష్టించండి

HTML లోని ఖాళీలను సృష్టించడం మరియు మూలకాలను భౌతికంగా వేరు చేయడం ప్రారంభ వెబ్ డిజైనర్‌కు అర్థం చేసుకోవడం కష్టం. HTML కు "వైట్‌స్పేస్ పతనం" అని పిలువబడే ఆస్తి ఉంది. మీరు మీ HTML కోడ్‌లో 1 స్థలం లేదా 100 అని టైప్ చేసినా, వెబ్ బ్రౌజర్ స్వయంచాలకంగా ఆ ఖాళీలను ఒకే స్థలానికి తగ్గిస్తుంది. ఇది మైక్రోసాఫ్ట్ వర్డ్ వంటి ప్రోగ్రామ్ నుండి భిన్నంగా ఉంటుంది, ఇది డాక్యుమెంట్ సృష్టికర్తలు పదాలు మరియు ఆ పత్రం యొక్క ఇతర అంశాలను వేరు చేయడానికి బహుళ ఖాళీలను జోడించడానికి అనుమతిస్తుంది. వెబ్‌సైట్ డిజైన్ అంతరం ఎలా పనిచేస్తుందో కాదు.

కాబట్టి, మీరు నిర్మించిన వెబ్ పేజీలో కనిపించే HTML లో వైట్‌స్పేస్‌లను ఎలా జోడించాలి? ఈ వ్యాసం కొన్ని విభిన్న మార్గాలను పరిశీలిస్తుంది.

CSS తో HTML లో ఖాళీలు

మీ HTML లో ఖాళీలను జోడించడానికి ఇష్టపడే మార్గం క్యాస్కేడింగ్ స్టైల్ షీట్స్ (CSS). వెబ్‌పేజీ యొక్క ఏదైనా దృశ్యమాన అంశాలను జోడించడానికి CSS ఉపయోగించాలి, మరియు అంతరం ఒక పేజీ యొక్క దృశ్య రూపకల్పన లక్షణాలలో భాగం కాబట్టి, CSS అంటే మీరు దీన్ని చేయాలనుకుంటున్నారు.

CSS లో, మూలకాల చుట్టూ ఖాళీని జోడించడానికి మీరు మార్జిన్ లేదా పాడింగ్ లక్షణాలను ఉపయోగించవచ్చు. అదనంగా, టెక్స్ట్-ఇండెంట్ ఆస్తి పేరాగ్రాఫ్‌లను ఇండెంట్ చేయడం వంటి టెక్స్ట్ ముందు భాగంలో స్థలాన్ని జోడిస్తుంది.

మీ అన్ని పేరాగ్రాఫ్‌ల ముందు స్థలాన్ని జోడించడానికి CSS ను ఎలా ఉపయోగించాలో ఇక్కడ ఒక ఉదాహరణ. మీ బాహ్య లేదా అంతర్గత శైలి షీట్‌కు క్రింది CSS ని జోడించండి:

p {
టెక్స్ట్-ఇండెంట్: 3 ఎమ్;
}

మీ టెక్స్ట్ లోపల HTML లోని ఖాళీలు

మీరు మీ వచనానికి అదనపు స్థలం లేదా రెండింటిని జోడించాలనుకుంటే, మీరు విచ్ఛిన్నం కాని స్థలాన్ని ఉపయోగించవచ్చు. ఈ అక్షరం ప్రామాణిక స్థల అక్షరం వలె పనిచేస్తుంది, ఇది బ్రౌజర్ లోపల మాత్రమే కూలిపోదు.

వచన రేఖలో ఐదు ఖాళీలను ఎలా జోడించాలో ఇక్కడ ఒక ఉదాహరణ:

ఈ టెక్స్ట్ లోపల ఐదు అదనపు ఖాళీలు ఉన్నాయి

HTML ను ఉపయోగిస్తుంది:

ఈ టెక్స్ట్ లోపల ఐదు అదనపు ఖాళీలు ఉన్నాయి

మీరు కూడా ఉపయోగించవచ్చు
అదనపు పంక్తి విరామాలను జోడించడానికి ట్యాగ్ చేయండి.

ఈ వాక్యం చివర ఐదు పంక్తులు ఉన్నాయి

HTML లో అంతరం ఎందుకు చెడ్డ ఆలోచన

ఈ ఎంపికలు రెండూ పని చేస్తున్నప్పుడు - విచ్ఛిన్నం కాని ఖాళీ మూలకం మీ వచనానికి అంతరాన్ని జోడిస్తుంది మరియు పంక్తి విరామాలు పైన చూపిన పేరా క్రింద అంతరాన్ని జోడిస్తాయి - ఇది మీ వెబ్‌పేజీలో అంతరాన్ని సృష్టించడానికి ఉత్తమ మార్గం కాదు. మీ HTML కి ఈ అంశాలను జోడించడం వలన దృశ్య శైలుల (CSS) నుండి పేజీ (HTML) యొక్క నిర్మాణాన్ని వేరు చేయడానికి బదులుగా కోడ్‌కు దృశ్య సమాచారం జోడించబడుతుంది. భవిష్యత్తులో అప్‌డేట్ చేయడం మరియు మొత్తం ఫైల్ పరిమాణం మరియు పేజీ పనితీరుతో సహా అనేక కారణాల వల్ల ఇవి వేరుగా ఉండాలని ఉత్తమ పద్ధతులు నిర్దేశిస్తాయి.

మీ అన్ని శైలులు మరియు అంతరాలను నిర్దేశించడానికి మీరు బాహ్య స్టైల్ షీట్‌ను ఉపయోగిస్తే, మొత్తం సైట్ కోసం ఆ శైలులను మార్చడం చాలా సులభం, ఎందుకంటే మీరు ఆ స్టైల్ షీట్‌ను నవీకరించాలి.

వాక్యం పైన ఉన్న ఉదాహరణను ఐదుతో పరిగణించండి
దాని చివర ట్యాగ్‌లు. మీరు ప్రతి పేరా దిగువన అంతరం కావాలనుకుంటే, మీరు మీ మొత్తం సైట్‌లోని ప్రతి పేరాకు ఆ HTML కోడ్‌ను జోడించాలి. ఇది మీ పేజీలను ఉబ్బిన అదనపు మార్కప్ యొక్క సరసమైన మొత్తం. అదనంగా, ఈ అంతరం చాలా ఎక్కువ లేదా చాలా తక్కువగా ఉందని మీరు నిర్ణయించుకుంటే, మరియు మీరు దానిని కొద్దిగా మార్చాలనుకుంటే, మీరు మీ మొత్తం వెబ్‌సైట్‌లోని ప్రతి పేరాను సవరించాలి. అక్కర్లేదు!

ఈ అంతరం మూలకాలను మీ కోడ్‌కు జోడించే బదులు, CSS ని ఉపయోగించండి.

p {
పాడింగ్-బాటమ్: 20 పిక్స్‌;
}

CSS యొక్క ఒక పంక్తి మీ పేజీ యొక్క పేరాగ్రాఫ్ల క్రింద అంతరాన్ని జోడిస్తుంది. మీరు భవిష్యత్తులో ఆ అంతరాన్ని మార్చాలనుకుంటే, ఈ ఒక పంక్తిని సవరించండి (మీ మొత్తం సైట్ కోడ్‌కు బదులుగా) మరియు మీరు వెళ్ళడం మంచిది!

ఇప్పుడు, మీరు మీ వెబ్‌సైట్‌లోని ఒక భాగంలో ఒకే స్థలాన్ని జోడించాల్సిన అవసరం ఉంటే, a
ట్యాగ్ లేదా ఒకే బ్రేకింగ్ స్థలం ప్రపంచం అంతం కాదు, కానీ మీరు జాగ్రత్తగా ఉండాలి. ఈ ఇన్లైన్ HTML అంతరం ఎంపికలను ఉపయోగించడం జారే వాలు. ఒకటి లేదా రెండు మీ సైట్‌ను బాధించకపోవచ్చు, మీరు ఆ మార్గంలో కొనసాగితే, మీరు మీ పేజీలలో సమస్యలను ప్రవేశపెడతారు. చివరికి, మీరు HTML అంతరం మరియు అన్ని ఇతర వెబ్‌పేజీ దృశ్య అవసరాల కోసం CSS వైపు తిరగడం మంచిది.