HTML లో కాలిక్యులేటర్‌ను ప్రోగ్రామింగ్ చేస్తోంది

రచయిత: Tamara Smith
సృష్టి తేదీ: 27 జనవరి 2021
నవీకరణ తేదీ: 1 జూలై 2024
Anonim
html మరియు css ఉపయోగించి కాలిక్యులేటర్‌ను ఎలా తయారు చేయాలి
వీడియో: html మరియు css ఉపయోగించి కాలిక్యులేటర్‌ను ఎలా తయారు చేయాలి

విషయము

అంతర్నిర్మిత కాలిక్యులేటర్ ఉపయోగించి కంప్యూటర్‌తో లెక్కించడానికి అనేక మార్గాలు ఉన్నాయి, కానీ మరొక మార్గం సాధారణ HTML కోడ్‌ను ఉపయోగించి మీ స్వంతంగా నిర్మించడం. HTML ఉపయోగించి కాలిక్యులేటర్ చేయడానికి, మీకు కొన్ని ప్రాథమిక HTML జ్ఞానం అవసరం, ఆపై అవసరమైన కోడ్‌ను టెక్స్ట్ ఎడిటర్‌లో ఎంటర్ చేసి HTML ఫైల్‌గా సేవ్ చేయండి. మీకు ఇష్టమైన బ్రౌజర్‌లో HTML ఫైల్‌ను తెరవడం ద్వారా మీరు కాలిక్యులేటర్‌ను ఉపయోగించవచ్చు. మీరు మీ బ్రౌజర్‌లో అంకగణిత కార్యకలాపాలను చేయగలుగుతారు, కానీ ప్రోగ్రామింగ్ కళ గురించి కొన్ని ప్రాథమిక నైపుణ్యాలను కూడా నేర్చుకోగలుగుతారు!

అడుగు పెట్టడానికి

4 యొక్క పార్ట్ 1: కోడ్‌ను అర్థం చేసుకోవడం

  1. ప్రతి HTML ఫంక్షన్ ఏమి చేస్తుందో తెలుసుకోండి. మీ కాలిక్యులేటర్‌ను సృష్టించడానికి మీరు ఉపయోగిస్తున్న కోడ్ పత్రం యొక్క విభిన్న అంశాలను కలిపి నిర్వచించే అనేక రకాల వాక్యనిర్మాణాలను కలిగి ఉంటుంది. ఈ ప్రక్రియ యొక్క వివరణ కోసం ఇక్కడ క్లిక్ చేయండి లేదా కాలిక్యులేటర్‌ను రూపొందించడానికి కోడ్ యొక్క ప్రతి పంక్తి ఏమి చేస్తుందో గురించి మరింత తెలుసుకోవడానికి చదవండి.
    • html: ఈ బిట్ సింటాక్స్ కోడ్‌లో ఏ భాష ఉపయోగించబడుతుందో మిగిలిన పత్రానికి చెబుతుంది. కోడ్ చేయడానికి అనేక భాషలు ఉన్నాయి మరియు ఈ సందర్భంలో html> అది ఉన్న మిగిలిన పత్రానికి స్పష్టం చేస్తుంది - మీరు ess హించినది - html.
    • తల: పత్రం తర్వాత ప్రతిదీ డేటా గురించి డేటా అని "మెటాడేటా" అని కూడా చెబుతుంది. హెడ్> కమాండ్ సాధారణంగా పత్రం యొక్క శైలీకృత అంశాలను, శీర్షికలు, శీర్షికలు మొదలైనవాటిని నిర్వచించడానికి ఉపయోగిస్తారు. మిగిలిన కోడ్ నిర్వచించబడిన గొడుగుగా భావించండి.
    • శీర్షిక: మీ పత్రం యొక్క శీర్షిక ఇక్కడ సూచించబడింది. HTML బ్రౌజర్‌లో పత్రం తెరిచినప్పుడు దాని శీర్షికను సూచించడానికి ఈ లక్షణం ఉపయోగించబడుతుంది.
    • శరీరం bgcolor = "#": ఈ లక్షణం HTML పేజీ మరియు శరీరం యొక్క నేపథ్యం యొక్క రంగును సెట్ చేస్తుంది. కొటేషన్ మార్క్ స్ట్రింగ్‌లోని సంఖ్య మరియు # తర్వాత ఒక నిర్దిష్ట రంగుకు అనుగుణంగా ఉంటుంది.
    • టెక్స్ట్ = "": ఈ వాక్యనిర్మాణం పత్రం యొక్క వచనం యొక్క రంగును సెట్ చేస్తుంది.
    • రూపం పేరు = "": ఈ లక్షణం ఒక రూపం యొక్క పేరును నిర్దేశిస్తుంది మరియు ఫారమ్ పేరు యొక్క అర్ధం గురించి జావాస్క్రిప్ట్‌కు తెలిసిన దాని ఆధారంగా తదుపరి వచ్చే నిర్మాణాన్ని నిర్మించడానికి ఉపయోగిస్తారు. ఉదాహరణకు, మేము ఉపయోగించబోయే ఫారమ్ పేరు "కాలిక్యులేటర్", ఇది పత్రం కోసం ఒక నిర్దిష్ట నిర్మాణాన్ని సృష్టించడానికి మేము ఉపయోగించబోతున్నాము.
    • ఇన్పుట్ రకం = "": ఇక్కడే ఏదో జరుగుతుంది. "ఇన్పుట్ రకం" లక్షణం కొటేషన్ మార్కుల మధ్య విలువలలో ఎలాంటి వచనం ఉందో పత్రం యొక్క పార్సర్‌కు చెబుతుంది. ఉదాహరణకు, ఇది టెక్స్ట్, పాస్‌వర్డ్, బటన్ (కాలిక్యులేటర్ మాదిరిగానే ఉంటుంది) మొదలైనవి కావచ్చు.
    • విలువ = "": ఈ ఆదేశం పై ఇన్పుట్ రకంలో ఏమి చేర్చబడిందో పత్రం యొక్క పార్సర్‌కు చెబుతుంది. కాలిక్యులేటర్ కోసం, ఇవి సంఖ్యలు (1-9) మరియు కార్యకలాపాలు (+, -, *, /, =).
    • onClick = "": ఈ వాక్యనిర్మాణం ఒక సంఘటనను వివరిస్తుంది, బటన్ క్లిక్ చేసినప్పుడు ఏదో ఒకటి చేయాలని సూచిస్తుంది. ఒక కాలిక్యులేటర్ కోసం, ప్రతి బటన్‌లోని వచనాన్ని కూడా గుర్తించాలని మేము కోరుకుంటున్నాము. కాబట్టి "6" బటన్ ముందు, కొటేషన్ మార్కుల మధ్య document.calculator.ans.value + = "6" ను ఉంచాము.
    • br: ఈ ట్యాగ్ పత్రంలో క్రొత్త పంక్తిని సృష్టిస్తుంది, తద్వారా వచనం (లేదా మరేదైనా) దాని తర్వాత మరొక పంక్తిలో ఉంచబడుతుంది.
    • / form, / body మరియు / html: ఈ ఆదేశాలు పత్రంలో గతంలో తెరిచిన సంబంధిత ఆదేశాలకు క్లోజర్లు.

4 యొక్క పార్ట్ 2: HTML కాలిక్యులేటర్ కోసం ప్రామాణిక కోడ్

  1. దిగువ కోడ్‌ను కాపీ చేయండి. ఎడమ మౌస్ బటన్‌ను నొక్కి పట్టుకుని, కర్సర్‌ను బాక్స్ దిగువ ఎడమ నుండి ఎగువ కుడి వైపుకు లాగడం ద్వారా క్రింది పెట్టెలోని వచనాన్ని ఎంచుకోండి, తద్వారా అన్ని వచనం నీలం రంగులోకి మారుతుంది. క్లిప్‌బోర్డ్‌కు కోడ్‌ను కాపీ చేయడానికి Mac లో "కమాండ్ + సి" లేదా పిసిలో "సిటిఆర్ఎల్ + సి" నొక్కండి.

hm calculator.ans.value + = '1' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 2 "onClick =" document.calculator.ans.value + = '2' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 3 "onClick =" document.calculator.ans.value + = '3' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" + "onClick =" document.calculator.ans.value + = '+' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 4 "onClick =" document.calculator.ans.value + = '4' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 5 "onClick =" document.calculator.ans.value + = '5' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 6 "onClick =" document.calculator.ans.value + = '6' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" - "onClick =" document.calculator.ans. value + = '-' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 7 "onClick =" document.calculator.ans.value + = '7' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 8 "onClick =" document.calculator.ans.value + = '8' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 9 "onClick =" document.calculator.ans.value + = '9' "> ఇన్పుట్ రకం =" బటన్ "విలువ = " *" onClick = "document.calcul ator.ans.value + = ' *' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" / "onClick =" document.calculator.ans.value + = '/' "> ఇన్పుట్ రకం =" బటన్ "విలువ =" 0 "onClick =" document.calculator.ans.value + = '0' "> ఇన్పుట్ రకం =" రీసెట్ "విలువ =" రీసెట్ "> ఇన్పుట్ రకం =" బటన్ "విలువ =" = "onClick =" document.calculator.ans .value = eval (document.calculator.ans.value) "> br> ప్రతిస్పందన isinput type =" textfield "name =" ans "value =" "> / form> / body> / html>

4 యొక్క 3 వ భాగం: మీ స్వంత కాలిక్యులేటర్‌ను తయారు చేయడం

  1. మీ కంప్యూటర్‌లో టెక్స్ట్ ఎడిటర్‌ను తెరవండి. ఉపయోగించడానికి అనేక ప్రోగ్రామ్‌లు ఉన్నాయి, కానీ సరళత కోసం మేము టెక్స్ట్ ఎడిట్ లేదా నోట్‌ప్యాడ్‌కు అంటుకుంటాము.
    • Mac లో, స్పాట్‌లైట్ తెరవడానికి స్క్రీన్ కుడి ఎగువ మూలలో ఉన్న భూతద్దం క్లిక్ చేయండి. మీరు అక్కడికి చేరుకున్నప్పుడు, టెక్స్ట్ఎడిట్ టైప్ చేసి, టెక్స్ట్ఎడిట్ ప్రోగ్రామ్ పై క్లిక్ చేయండి, అది ఇప్పుడు నీలం రంగులో ఎంచుకోవాలి.
    • PC లో, స్క్రీన్ దిగువ ఎడమ వైపున ప్రారంభ మెనుని తెరవండి. శోధన పట్టీలో, నోట్‌ప్యాడ్ అని టైప్ చేసి, నోట్‌ప్యాడ్ అప్లికేషన్‌పై క్లిక్ చేయండి, ఇది కుడి వైపున ఉన్న సెర్చ్ బార్‌లో కనిపిస్తుంది.
  2. కాలిక్యులేటర్ కోసం HTML కోడ్‌ను పత్రంలో అతికించండి.
    • Mac లో, పత్రం యొక్క శరీరంపై క్లిక్ చేసి, నొక్కండి ఆదేశం + వి. అప్పుడు క్లిక్ చేయండి ఫార్మాట్ స్క్రీన్ పైభాగంలో మరియు తరువాత సాదా వచనాన్ని చేయండి కోడ్ అతికించిన తర్వాత.
    • PC లో, పత్రం యొక్క శరీరంపై క్లిక్ చేసి, ఆపై Ctrl + V..
  3. ఫైల్ను సేవ్ చేయండి. మీరు విండో యొక్క ప్రధాన మెనూలోని "ఫైల్" ద్వారా దీన్ని చేస్తారు, ఆపై ఇలా సేవ్ చేయండి ... PC లో లేదా సేవ్ ... డ్రాప్-డౌన్ మెను నుండి Mac లో.
  4. ఫైల్ పేరుకు HTML పొడిగింపును జోడించండి. "ఇలా సేవ్ చేయి ..." మెనులో, ఫైల్ పేరును టైప్ చేసి, ".html" తరువాత, "సేవ్" క్లిక్ చేయండి. ఉదాహరణకు, మీరు ఈ ఫైల్‌కు "నా మొదటి కాలిక్యులేటర్" అని పేరు పెట్టాలనుకుంటే, ఫైల్‌ను "నా మొదటి కాలిక్యులేటర్. Html" గా సేవ్ చేయండి.

4 యొక్క 4 వ భాగం: మీ కాలిక్యులేటర్‌ను ఉపయోగించండి

  1. మీరు ఇప్పుడే సృష్టించిన ఫైల్‌ను కనుగొనండి. ఇది చేయుటకు, మునుపటి దశలో వివరించిన విధంగా ఫైల్ పేరును స్పాట్‌లైట్‌లో లేదా ప్రారంభ మెను యొక్క శోధన పట్టీలో టైప్ చేయండి. "Html" పొడిగింపును కూడా టైప్ చేయడం అవసరం లేదు.
  2. దాన్ని తెరవడానికి మీ ఫైల్‌పై క్లిక్ చేయండి. మీ డిఫాల్ట్ బ్రౌజర్ మీ కాలిక్యులేటర్‌ను క్రొత్త వెబ్ పేజీలో తెరుస్తుంది.
  3. దీన్ని ఉపయోగించడానికి కాలిక్యులేటర్‌లోని బటన్లను క్లిక్ చేయండి. మీ సమీకరణాల పరిష్కారాలు ఇప్పుడు జవాబు పట్టీలో కనిపిస్తాయి.

చిట్కాలు

  • మీరు కోరుకుంటే ఈ కాలిక్యులేటర్‌ను వెబ్ పేజీలో చేర్చవచ్చు.
  • కాలిక్యులేటర్ యొక్క రూపాన్ని మార్చడానికి మీరు HTML శైలులను కూడా ఉపయోగించవచ్చు.