एचटीएमएल कोड का उपयोग कर कैलक्यूलेटर कैसे बनाएं
ऑपरेटिंग सिस्टम में बनाए गए कैलकुलेटर का उपयोग करके डेस्कटॉप कंप्यूटर के साथ गणितीय गणना करने के लिए असंख्य तरीके हैं, लेकिन यदि आप एक रचनात्मक व्यक्ति हैं जो बाहर खड़ा होना पसंद करते हैं, तो आप HTML का उपयोग करके एक कस्टम कैलकुलेटर बनाने का प्रयास कर सकते हैं। ऐसा करने के लिए, आपको एचटीएमएल के कुछ बुनियादी ज्ञान जानने की जरूरत है, एक साधारण पाठ संपादक में आवश्यक कोड की प्रतिलिपि बनाएँ और इसे एक HTML फ़ाइल के रूप में सहेजें। उस समय, आप अपने व्यक्तिगत इंटरनेट ब्राउज़र में HTML फ़ाइल को खोलकर अपने व्यक्तिगत कैलकुलेटर का उपयोग करने में सक्षम होंगे। इस तरह, आप न केवल एक साधारण इंटरनेट ब्राउज़र का उपयोग करके सबसे जटिल गणितीय गणना करने में सक्षम होंगे, आप भी प्रोग्रामिंग की कला के कुछ बुनियादी सिद्धांतों को भी सीखेंगे!
कदम
भाग 1
बुनियादी HTML सिंटैक्स को जानें
1
जानें कि HTML कोड कैसे काम करता है और उसको लिखने वाले अलग-अलग तत्व स्रोत कोड जिसे आप अपना कैलकुलेटर बनाने के लिए उपयोग करेंगे, HTML भाषा के वाक्यविन्यास के कई कीवर्ड से बना है, जो एक साथ सभी दस्तावेजों के सभी पहलुओं और कार्यों को परिभाषित करेगा। परामर्श करना इस अनुच्छेद एक HTML दस्तावेज़ बनाने की पूरी प्रक्रिया के बारे में अधिक जानकारी के लिए या यह समझने के लिए पढ़ना जारी रखें कि नमूना कैलकुलेटर बनाने के लिए प्रश्न में दिए गए प्रत्येक व्यक्तिगत कोड के लिए क्या आवश्यक है।
- एचटीएमएल: यह एचटीएमएल सिंटैक्स का एक कीवर्ड है जो इंटरनेट ब्राउज़र को इंगित करता है (जिस एंटिटी को स्क्रीन पर सापेक्ष सामग्री प्रदर्शित करने के लिए एचटीएमएल की व्याख्या करना होगा) कि दस्तावेज़ में बाकी पाठ एचटीएमएल कोड है। एक कार्यक्रम बनाने के लिए कई प्रोग्रामिंग भाषाएं हैं, इस मामले में टैग इंगित करता है कि बाकी कोड को HTML में लिखा गया था।
- सिर: यह एक एचटीएमएल टैग है जो दुभाषिया को इंगित करता है कि जिसमें सभी कोड शामिल है "मेटाडाटा", जो है, डेटा का वर्णन करने वाली जानकारी के लिए। टैग यह आम तौर पर तत्वों द्वारा अपनाई गई ग्राफिक शैलियों को परिभाषित करने के लिए उपयोग किया जाता है जो दस्तावेज बनाते हैं, उदाहरण के लिए पृष्ठ का शीर्षक, शीर्षक, आदि। एक संरचना के रूप में एचटीएमएल को कई स्तरों में बांटा गया है, जहां टैग "सिर" पहचान लें कि क्या शामिल होगा और जिसमें अन्य सभी उल्लेख करेंगे
- शीर्षक: यह टैग परिभाषित करता है कि दस्तावेज़ के शीर्षक (इसलिए संबंधित वेब पेज के) के रूप में प्रदर्शित किया जाएगा। इस विशेषता का उपयोग उस पाठ को परिभाषित करने के लिए किया जाता है जो ब्राउज़र द्वारा वेब पेज के शीर्षक बार में प्रदर्शित किया जाएगा।
- शरीर bgcolor = "#": यह टैग और उसके विशेषताओं का उपयोग रंग को परिभाषित करने के लिए किया जाता है जिसका इस्तेमाल पृष्ठभूमि और पाठ के वेब पृष्ठ पर प्रदर्शित करने के लिए किया जाएगा। हेक्साडेसिमल संख्या जो उद्धरण चिह्नों में दिखाई देती है, प्रतीक के साथ "#", इंगित करता है कि रंग संकेतित वस्तु के लिए उपयोग करने के लिए
- पाठ = "": इस विशेषता का इस्तेमाल उस तत्व के पाठ के रंग को बदलने के लिए किया जाता है जिसमें यह संदर्भित होता है (इस मामले में टैग "शव")।
- फ़ॉर्म का नाम ="": इस टैग और इसका विशेषता प्रपत्र के नाम को परिभाषित करने के लिए उपयोग किया जाता है। इस सूचना का उपयोग HTML कोड के कोड और आंतरिक संरचना को बनाने के लिए किया जाएगा, ताकि जावास्क्रिप्ट कंपाइलर को यह पता चल सके कि यह दस्तावेज के प्रत्येक तत्व और उसके साथ जुड़ी हर घटना को संदर्भित करता है। उदाहरण के लिए, प्रपत्र को लेख में कोड में परिभाषित किया गया है "कैलकुलेटर", तो हम इस नाम के साथ एक संरचना बनाएंगे, जिसे हम उपयोगकर्ता द्वारा उत्पन्न क्रियाओं और घटनाओं के प्रबंधन के लिए शेष कोड में देख सकते हैं।
- इनपुट प्रकार ="": इस टैग का उपयोग उन नियंत्रणों को परिभाषित करने के लिए किया जाता है जो उपयोगकर्ता एक विशिष्ट कार्य करने के लिए या डेटा सम्मिलित करने के लिए उपयोग कर सकते हैं। उदाहरण के लिए, यह एक टेक्स्ट फ़ील्ड, एक पासवर्ड या एक बटन (हमारे कैलकुलेटर के मामले में) हो सकता है।
- मूल्य ="": यह विशेषता उस मूल्य को इंगित करती है जो टैग के साथ परिभाषित इनपुट तत्व के भीतर प्रदर्शित की जाएगी "इनपुट प्रकार"। हमारे कैलकुलेटर के मामले में, संख्या (1 से 9) और गणितीय ऑपरेटर्स (+, -, *, /, =) प्रदर्शित किए जाएंगे।
- onclick ="": सिंटैक्स का यह हिस्सा इनपुट तत्व से जुड़ी कार्रवाई को परिभाषित करने के लिए कार्य करता है, जिसका अर्थ यह है कि उस ईवेंट को ट्रिगर करना चाहिए जब बटन को उपयोगकर्ता द्वारा दबाया जाता है हमारे उदाहरण में हम दबाए गए बटन के मान को पाठ क्षेत्र में प्रदर्शित करना चाहते हैं "परिणाम" दिखाने के लिए उपयोगकर्ता वह प्रदर्शन कर रहा है। बटन के मामले में "6", घटना "onclick" इसलिए निम्न मान मान लेंगे "document.calculator.ans.value + = `6`"।
- br: यह टैग दस्तावेज़ में एक लाइन ब्रेक सम्मिलित करता है, इसलिए आपको लपेटने की आवश्यकता है। HTML दस्तावेज़ में जो कुछ भी बाद में प्रदर्शित होने की आवश्यकता है, उसे टेक्स्ट की नई पंक्ति पर दिखाया जाएगा।
- / फॉर्म, / बॉडी और / html: ये कमांड प्रासंगिक उद्घाटन टैग के समापन टैग का प्रतिनिधित्व करते हैं और इसका इस्तेमाल HTML दस्तावेज़ के संबंधित वर्गों की परिभाषा को पूरा करने के लिए किया जाता है।
भाग 2
सरल कैलक्यूलेटर बनाने के लिए एचटीएमएल कोडलेख के इस खंड में कोड की प्रतिलिपि बनाएँ। माउस कर्सर के नीचे दिए गए बॉक्स में टेक्स्ट को हाइलाइट करें, ताकि यह पूरी तरह से नीला दिखाई दे। ऊपरी बाएं कोने पर प्रारंभ करें और, बाईं माउस बटन दबाए हुए, निचले दाएं कोने पर जाएं। इस बिंदु पर, हॉटकी संयोजन दबाएं "Command + C", मैकओएस सिस्टम पर, या "Ctrl + C", सिस्टम सिस्टम पर सिस्टम क्लिपबोर्ड में चयनित पाठ की प्रतिलिपि बनाने के लिए।
HTML कैलक्यूलेटर
भाग 3
अपना कैलक्यूलेटर बनाएं
1
अपने कंप्यूटर पर एक पाठ संपादक खोलें ऐसे कई प्रोग्राम हैं जिनका उपयोग इस चरण को करने के लिए किया जा सकता है, लेकिन सुविधा और सादगी के लिए टेक्स्टएडिट या नोटपैड का उपयोग करना बेहतर है।
- मैकोड सिस्टम पर, स्पॉटलाइट सिस्टम टूल खोलने के लिए स्क्रीन के ऊपरी दाएं कोने में आवर्धक ग्लास आइकन पर क्लिक करें। इस बिंदु पर, कीवर्ड का प्रयोग करके खोज करें "TextEdit" (उद्धरण चिह्नों के बिना), फिर रिश्तेदार आइकन का चयन करें जो आपको परिणामों की सूची में मिलता है।
- विंडोज सिस्टम पर, मेनू का उपयोग करें "प्रारंभ" डेस्कटॉप के निचले बाएं कोने में रखा गया। कीवर्ड टाइप करें "नोटपैड" खोज पट्टी के भीतर, फिर परिणाम सूची में स्थित प्रासंगिक आइकन का चयन करें।
2
एचटीएमएल कोड पेस्ट करें, जिसे आपने लेख के पिछले अनुभाग से कॉपी किया है, एक नया रिक्त दस्तावेज़ में।
3
दस्तावेज़ को सहेजें ऐसा करने के लिए, मेनू पर पहुंचें "फ़ाइल" खिड़की के ऊपरी बाईं ओर स्थित, फिर विकल्प चुनें "इस रूप में सहेजें ...", विंडोज सिस्टम पर, या "सहेजें ...", मैक पर
4
विस्तार जोड़ें "एचटीएमएल" फ़ाइल का नाम दस्तावेज़ के लिए नाम के सापेक्ष क्षेत्र के भीतर, जिसे आप संवाद बॉक्स में ढूंढते हैं "के रूप में सहेजें", एक्सटेंशन के बाद फ़ाइल को असाइन करने के लिए नाम टाइप करें ".html" (उद्धरण चिह्नों के बिना), फिर बटन दबाएं "सहेजें"। उदाहरण के लिए, यदि आप नाम का उपयोग करना चाहते हैं "मेरा पहला कैलकुलेटर", आपको फ़ाइल को इस रूप में सहेजना होगा "lamiaprimacalcolatrice.html"
भाग 4
एचटीएमएल कैलकुलेटर का उपयोग करें
1
आपके द्वारा बनाए गए HTML फ़ाइल का पता लगाएं। ऐसा करने के लिए, सुविधा का उपयोग करके खोज करें "स्पॉटलाइट" या मेनू या स्क्रीन की खोज बार "प्रारंभ", जैसा कि लेख के पिछले खंड में वर्णित है इस मामले में यह एक्सटेंशन भी टाइप करने के लिए आवश्यक नहीं है ".html"।
2
इसे खोलने के लिए खोज परिणाम सूची में दिखाई देने वाले फ़ाइल आइकन पर क्लिक करें। एक HTML फ़ाइल होने के नाते, यह सिस्टम डिफ़ॉल्ट इंटरनेट ब्राउज़र का उपयोग करके स्वचालित रूप से खोला जाएगा
3
स्क्रीन पर दिखाई देने वाले कैलकुलेटर बटन का उपयोग करें, जैसा कि आप सामान्य रूप से करेंगे सम्मिलित समीकरण का समाधान टेक्स्ट फ़ील्ड में दिखाया जाएगा "परिणाम", बटन दबाने के बाद "="।
टिप्स
- आप किसी भी वेब पेज पर इस आलेख में दिखाए गए कैलकुलेटर के लिए HTML कोड दर्ज कर सकते हैं।
- यदि आप चाहें, तो आप अपने कैलकुलेटर के दृश्य स्वरूप को बदलने के लिए शैली से संबंधित HTML टैग का उपयोग भी कर सकते हैं।
सामाजिक नेटवर्क पर साझा करें:
संबद्ध
ब्लॉग पर एक पृष्ठभूमि कैसे जोड़ें- टेक्स्ट का रंग HTML में कैसे बदला जाए
- HTML में केंद्र पाठ कैसे करें
- वर्ड डॉक्यूमेंट को एचटीएमएल में कनवर्ट कैसे करें
- HTML फ़ॉर्म कैसे बनाएं
- HTML में हाइपरलिंक कैसे बनाएं
- एक एचटीएमएल फॉर्म कैसे बनाएं जिसे एक ईमेल पता भेजा जा सकता है
- एचटीएमएल कोड का प्रयोग करके आपकी वेबसाइट पर जावास्क्रिप्ट कैसे जोड़ें
- एक छवि को लिंक कैसे जोड़ें
- जावा के बिना एचटीएमएल में एक विस्तार सूची कैसे बनाएं
HTML का उपयोग करते हुए एक टेक्स्ट बॉक्स कैसे बनाएं- जावास्क्रिप्ट में छवियों का रोलओवर कैसे बनाएं
जीमेल पर एक HTML हस्ताक्षर कैसे बनाएं
HTML के साथ एक सरल वेब पेज कैसे बनाएं
इंटरैक्टिव डेस्कटॉप पृष्ठभूमि कैसे बनाएं
कैसे एक HTML फ़ाइल को चलाने के लिए
एचटीएमएल कोड का इस्तेमाल करते हुए एक छवि में एक लिंक कैसे डालें- HTML में टिप्पणियाँ कैसे लिखें
वीबीस्क्रिप्ट में कार्यक्रम कैसे करें
एचटीएमएल में एक सीएसएस फ़ाइल का उपयोग कैसे करें
सरल तरीके में HTML प्रारूप का उपयोग कैसे करें