.OnlineGuruji: HTML

.OnlineGuruji

Provides E-Notes,Video Tutorials And Download Links For Students In hindi

*********************************************************

*********************************************************
********************************************************************************

Breaking

Ramchandicollege Saraipali

Technology Jobs

OnlineGuru Blog मे आपका स्वागत है ब्लॉग से संबन्धित जानकारी के लिए संपर्क करें मो ॰ नम ।-9826026747(सपन कुमार दास) अपने विषय से संबन्धित अपडेट प्राप्त करने के लिए ब्लॉग पे दिये गए Bell Icon को press करें कम्प्युटर,Science,English Grammer से संबन्धित विषय की अधिक जानकारी के लिए हमारे ब्लॉग अथवा यू ट्यूब चैनल को सब्क्राइब करे ..
Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Saturday, March 15, 2025

March 15, 2025

बेसिक HTML tag

 


Basic tags in HTML.

Heading Tags

हेडिंग टैग का उपयोग headings of documents को परिभाषित करने के लिए किया जाता है। आप अपने headings के लिए अलग-अलग sizes का उपयोग कर सकते हैं। HTML में six levels of headings जो <h1>, <h2>, <h3>, <h4>, <h5> और <h6>  का उपयोग करते हैं।

Example:-

<!DOCTYPE html>

<html>

<head>

   <title>Heading Example</title>

</head>

<body>

   <h1>This is heading 1</h1>

   <h2>This is heading 2</h2>

   <h3>This is heading 3</h3>

   <h4>This is heading 4</h4>

   <h5>This is heading 5</h5>

   <h6>This is heading 6</h6>

</body>

</html>

Output:-

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5

This is heading 6

Paragraph Tag

<p> tag  का उपयोग  different different paragraphs के लिए किया जाता है . प्रत्येक  paragraph का  text  <p>के साथ openहोता है और   </p> tag के साथ close होता है .

 

Example

The following example demonstrates the use of paragraph (<p>) tag, here we are defining 3 paragraphs

<!DOCTYPE html>

<html>

<head>

   <title>Paragraph Example</title>

</head>

<body>

   <p>Here is a first paragraph of text.</p>

   <p>Here is a second paragraph of text.</p>

   <p>Here is a third paragraph of text.</p>

</body>

</html>

Output:-

Here is a first paragraph of text.

Here is a second paragraph of text.

Here is a third paragraph of text.

Line Break Tag

Whenever you use the <br /> element, anything following it starts from the next line. This tag is an example of an empty element, where you do not need opening and closing tags, as there is nothing to go in between them.

 

The <br /> tag has a space between the characters br and the forward slash /. If you omit this space, older browsers will have trouble rendering the line break, while if you miss the forward slash character and just use <br

Example

The following example demonstrates the use of break (<br />) tag

<!DOCTYPE html>

<html>

<head>

   <title>Line Break Example</title>

</head>

<body>

   <p>Hello<br /> You delivered your assignment on time.<br />

      Thanks<br /> Mahnaz</p>

</body>

</html>

Hello

You delivered your assignment on time.

Thanks

Mahnaz

Center Tag

The <center> tag aligns text, images, or other HTML elements in the middle of a web page.

 

Note: The <center> tag is deprecated in HTML5. You can use the CSS text-align property to center elements.

 

Example

The following example demonstrates the use of the <center> tag. Here, we are displaying the second paragraph in center alignment:

<!DOCTYPE html>

<html>

<head>

   <title>Centering Content Example</title>

</head>

<body>

   <p>This text is not in the center.</p>

   <center>

      <p>This text is in the center.</p>

   </center>

</body>

</html>

Output:-

This text is not in the center.

This text is in the center.

Horizonal Rule Tag

The horizontal rule (<hr>) tag displays a horizonal line. A horizontal line visually breaks up sections of a document. The <hr> tag creates a line from the current position in the document to the right margin and breaks the line accordingly.

 

Example

The following example draws a horizontal line between two paragraphs

<!DOCTYPE html>

<html>

<head>

   <title>Horizontal Line Example</title>

</head>

<body>

   <p>This is paragraph one and should be on top</p>

   <hr />

   <p>This is paragraph two and should be at bottom</p>

</body>

</html>

Output:-

 

This is paragraph one and should be on top

 

This is paragraph two and should be at bottom

Preserve Formatting Tag

The <pre> tag is used to preserve the formatting. Whenever you want to display content on the webpage exactly in the same format as it was written in the HTML document, you can use the <pre> tag. It preserves the formatting of source code, including line breaks and indentation.

 

Example

The following example demonstrates the use of the <pre> tag. Here, we are displaying some code that should keep the formatting exactly the same as it is written inside the <pre> tag

<!DOCTYPE html>

<html>

<head>

   <title>Preserve Formatting Example</title>

</head>

<body>

   <pre>

      function testFunction( strText ){

         alert (strText)

      }

   </pre>

</body>

</html>

Output:-

 

function testFunction( strText ){

         alert (strText)

      }

March 15, 2025

What is HTML?Basic HTML Structure:------

 


HTML एक मानक मार्कअप भाषा है, जिसका पूरा नाम हाइपर टेक्स्ट मार्कअप भाषा (Hyper Text Markup Language) है। यह वेबपेज बनाने के लिए व्यापक रूप से उपयोग की जाने वाली भाषा है। HTML का आविष्कार टिम बर्नर्स-ली (Tim Berners-Lee) ने 1991 के अंत में किया था, लेकिन इसका पहला संस्करण "HTML 1.0" वर्ष 1993 में जारी किया गया था। "HTML 2.0" पहला मानक HTML विनिर्देश (specification) था, जिसे 1995 में प्रकाशित किया गया था।

HTML क्या है?

HTML (HyperText Markup Language) एक मानक मार्कअप भाषा है, जिसका उपयोग वेबपेज की संरचना (structure) को डिज़ाइन करने के लिए किया जाता है। HTML दो शब्दों का संयोजन है: HyperText और Markup Language

  • HyperText वेबपेजों के बीच आंतरिक लिंक (internal links) को परिभाषित करता है।
  • Markup Language टेक्स्ट और मीडिया की लेआउट (layout) और प्रस्तुति (presentation) को परिभाषित करता है।

HTML की मूल संरचना

HTML दस्तावेज़ की बुनियादी संरचना में कुछ आवश्यक टैग होते हैं, जिनका उपयोग वेबपेज बनाने के लिए आवश्यक होता है। किसी भी प्रकार का HTML दस्तावेज़ बनाने के लिए इस संरचना का पालन करना अनिवार्य है।

<!DOCTYPE html>

<html>

<head>

   <title>Page title</title>

</head>

<body>

   <h1>Webpage's Heading</h1>

   <p>Content (Your first paragraph).</p>

</body>

</html>

Creating an HTML Document

HTML दस्तावेज़ एक फ़ाइल होती है जिसमें HTML कोड लिखा होता है और इसे ".htm" या ".html" एक्सटेंशन के साथ सहेजा जाता है। HTML दस्तावेज़ बनाने के लिए आपको एक टेक्स्ट एडिटर की आवश्यकता होती है, और इसे प्रदर्शित करने के लिए आपको एक वेब ब्राउज़र की जरूरत होती है।

HTML दस्तावेज़ बनाने के लिए निम्नलिखित चरणों का पालन करें –

  1. एक टेक्स्ट एडिटर खोलें (जैसे Notepad, VS Code)।
  2. HTML कोड लिखें
  3. फ़ाइल को ".htm" या ".html" एक्सटेंशन के साथ सहेजें

    Advantages of Learning HTML  HTML सीखने के कुछ प्रमुख लाभ निम्नलिखित हैं –

    Create a web site यदि आप HTML को अच्छी तरह से जानते हैं, तो आप एक नई वेबसाइट बना सकते हैं या पहले से मौजूद वेब टेम्पलेट को कस्टमाइज़ कर सकते हैं।

    Become a web designer यदि आप एक पेशेवर वेब डिज़ाइनर के रूप में करियर शुरू करना चाहते हैं, तो HTML और CSS सीखना अनिवार्य है।

    Understand web- यदि आप अपनी वेबसाइट को बेहतर प्रदर्शन और तेज़ लोडिंग स्पीड के लिए ऑप्टिमाइज़ करना चाहते हैं, तो HTML का ज्ञान बेहतरीन परिणाम प्राप्त करने में मदद करता है

    Learn other languages एक बार जब आप HTML की मूल बातें समझ लेते हैं, तो JavaScript, PHP, या Angular जैसी अन्य संबंधित तकनीकों को सीखना आसान हो जाता है।

    Applications of HTML                                                                                                जैसा कि पहले बताया गया है, HTML वेब पर सबसे अधिक उपयोग की जाने वाली भाषाओं में से एक है। इसके कुछ प्रमुख अनुप्रयोग निम्नलिखित हैं –

    वेबसाइट विकास (Website Development) – HTML का उपयोग वेबपेज (वेबसाइट) बनाने के लिए किया जाता है। लगभग हर वेबपेज में HTML टैग होते हैं, जो ब्राउज़र में उसकी जानकारी को प्रस्तुत करने में मदद करते हैं।

    इंटरनेट नेविगेशन (Internet Navigation) – HTML नेविगेशन टैग प्रदान करता है, जो एक पेज से दूसरे पेज पर जाने के लिए उपयोग किए जाते हैं। यह इंटरनेट ब्राउज़िंग का एक महत्वपूर्ण हिस्सा है।

    रेस्पॉन्सिव UI (Responsive UI) – आधुनिक HTML पेज मोबाइल, टैबलेट, डेस्कटॉप, और लैपटॉप जैसे सभी प्लेटफार्मों पर अच्छी तरह काम करते हैं, क्योंकि अब वे रेस्पॉन्सिव डिज़ाइन स्ट्रैटेजी का समर्थन करते हैं।

    ऑफ़लाइन समर्थन (Offline Support) – एक बार HTML पेज लोड हो जाने के बाद, उसे इंटरनेट कनेक्शन के बिना भी ऑफ़लाइन एक्सेस किया जा सकता है।

    गेम डेवलपमेंट (Game Development)HTML5 में मल्टीमीडिया और इंटरएक्टिव कंटेंट के लिए नेटिव सपोर्ट मौजूद है, जिससे यह गेम डेवलपमेंट के क्षेत्र में भी उपयोगी हो गया है।

    मोबाइल एप्लिकेशन डेवलपमेंट (Mobile Application Development)HTML, CSS3, और JavaScript की मदद से क्रॉस-प्लेटफ़ॉर्म मोबाइल एप्लिकेशन विकसित की जा सकती हैं।

    मल्टीमीडिया और वीडियो स्ट्रीमिंग (Multimedia & Video Streaming)HTML5 में वीडियो और ऑडियो तत्वों (elements) के लिए इनबिल्ट सपोर्ट होता है, जिससे वेब ब्राउज़र में सीधे मीडिया प्लेबैक संभव हो जाता है।                                                                                                                                    

    Basic HTML Structure

    HTML दस्तावेज़ की बुनियादी संरचना में कुछ आवश्यक टैग होते हैं, जिनका उपयोग किसी भी वेबपेज को बनाने के लिए अनिवार्य होता है। इस संरचना का पालन करना प्रत्येक HTML दस्तावेज़ के लिए आवश्यक है।

    <!DOCTYPE html>

    <html>

    <head>

       <title>Page title</title>

    </head>

    <body>

       <h1>Webpage's Heading</h1>

       <p>Content (Your first paragraph).</p>

    </body>

    </html>

     

     

    Elements of HTML Basic Structure

    The following are the basic tags that define the basic HTML structure

    1. <!DOCTYPE html>

    This element defines the document type as HTML. This element must be written before writing any HTML document.                                                                        यह तत्व दस्तावेज़ के प्रकार (Document Type) को HTML के रूप में परिभाषित करता है। इसे किसी भी HTML दस्तावेज़ को लिखने से पहले अनिवार्य रूप से लिखा जाना चाहिए

    2. <html>...</html>

    The <html> tag is the parent tag for all HTML elements. Everything related to create an HTML document must be written inside the <html> tag. CSS, JavaScript, and jQuery must also be written inside this tag.                                                              यह सभी HTML तत्वों का मूल (Parent) टैग है। HTML दस्तावेज़ बनाने से संबंधित संपूर्ण कोड इस टैग के अंदर लिखा जाता है। CSS, JavaScript और jQuery को भी इसी टैग के अंदर लिखा जाता है।

    3. <head>...</head>

    The <head> tag is a container tag for all those elements that are not directly displayed on the webpage but required for the page functionalities. It contains meta tags (which are used for SEO purposes), title tag, script tags, etc.                                          यह उन सभी तत्वों का कंटेनर टैग है, जो सीधे वेबपेज पर प्रदर्शित नहीं होते, लेकिन पेज की कार्यक्षमता (Functionality) के लिए आवश्यक होते हैं। इसमें मेटा टैग (SEO के लिए), टाइटल टैग, स्क्रिप्ट टैग आदि होते हैं।

    4. <title>...</title>

    The <title> tag is used to define the title of the webpage that you can see in the browser's tab, bookmarks list, and search engine results. This tag is also very important for SEO purposes to help search engine to understand the content of the webpage.                                                                                                                       यह टैग वेबपेज के शीर्षक (Title) को परिभाषित करता है, जिसे आप ब्राउज़र के टैब, बुकमार्क सूची और सर्च इंजन परिणामों में देख सकते हैं। यह SEO के लिए बहुत महत्वपूर्ण है, क्योंकि यह सर्च इंजन को वेबपेज की सामग्री समझने में मदद करता है

    5. <body>...<body>

    The <body> tag is the container tag for all those elements, which represents the main content of a webpage that displays on the browser.                                                                   यह उन सभी तत्वों का कंटेनर टैग है, जो वेबपेज की मुख्य सामग्री को प्रदर्शित करते हैं।

    6. <h1>...</h1>

    The <h1> tag is one of the heading tags. It is the most important heading tag, which defines the main title or headline of the webpage. Any text written inside <h1> and </h1> is a top-level heading of the content.                                                                                           यह शीर्षक (Heading) टैगों में से एक है। यह सबसे महत्वपूर्ण शीर्षक टैग होता है, जो वेबपेज के मुख्य शीर्षक या हेडलाइन को परिभाषित करता है। <h1> और </h1> के बीच लिखा गया टेक्स्ट सामग्री का शीर्ष स्तर (Top-Level Heading) होता है।

    7. <p>...</p>

    The <p> tag defines a paragraph, anything written inside <p> and </p> displays as a paragraph on the webpage. Use multiple <p> tags to display text in different paragraphs.                                                                                                                                                     ह टैग एक पैराग्राफ को परिभाषित करता है<p> और </p> के बीच लिखा गया कोई भी टेक्स्ट वेबपेज पर पैराग्राफ के रूप में प्रदर्शित होता हैअलग-अलग पैराग्राफ दिखाने के लिए कई <p> टैग का उपयोग करें।

    Writing Hello World in HTML

    By using the above basic HTML structure, we can write an HTML document to display "Hello World" on the webpage.

    <!DOCTYPE html>

    <html>

    <head>

       <title>Hello World Example by TutorialsPoint</title>

    </head>

    <body>

       <h1>Hello, World!</h1>

    </body>

    </html>

    </pre>       Output:-


Tuesday, June 16, 2020

June 16, 2020

HTML----इलेक्ट्रॉनिक पेमेन्ट सिस्टम (EPS) **Created By- गोवर्धन यादव **


EPS-VIEW NOTES AND DOWNLOAD


What is Electronic Payment System ?

Internet या online के माध्यम से खरीदने और बेचने के work को E-Commerce कहा जाता है . और जब online खरीदी – बिक्री करने के पश्चात online payment किया जाता है और payment करने के लिए जिस method का उपयोग किया जाता है उस method को EPS (Electronic Payment System कहा जाता है .

उदाहारण के लिए हम लोग PhonePay के माध्यम से मोबाइल recharge इत्यादि करते है ये सभी EPS के उदाहारण है .

EPS के उदाहारण- Paytm , Bhim , UPI , Google Pay , Online Banking etc.

Features of electronic payment system

       1-    Convenience ( सुविधा )

       2-    Security  ( सुरक्षा )

       3-    Anonymity

       4-    Universality  ( सर्वभौमिकता)

  1. Convenience - Electronic payment system के अंतर्गत लेनदेन करने के लिए कस्टमर और Businessman होने के लिए Special facility, special electronic gadgets और time की आवश्यकता नहीं होती, इसके लिए minimum facility, electronic gadgets और time में ही काम हो जाता है।
  2. security- E-commerce को अपनाने वाले ग्राहकों के लिए सबसे बड़ी problem internet fraud का है। इसलिए payment system secure हो इसके लिए सबसे पहले customer की identity ही जाननी चाहिए ताकि सभी transaction केवल real customer के साथ ही किए जाएं। इसके बाद customer related information. उदाहरण के लिए, क्रेडिट कार्ड नंबर, बैंक अकाउंट नंबर अथवा पासवर्ड को अनाधिकृत व्यक्ति की पहुंच से सुरक्षित रखा जाए। इंटरनेट के माध्यम से प्रेषित किए जाने वाले Data में किसी भी प्रकार के changes किया जाए। 
  1. Anonymity- online customer की एक problem transactions से related process secure, payment work को  secure रखना तथा third party को खर्चीली आदतों को देखते हुए उसे रोकना है।
  2. Universality - internet businessman तथा customer के लिए E-payment system अत्यधिक सुविधाजनक तथा व्यापक रूप से स्वीकृत है, क्योंकि इसके विभिन्न प्रकार के लेनदेनों के लिए विभिन्न प्रकार की electronic currency जुटाने की आवश्यकता नहीं रहती, जो electronic currency उनके पास होती है, उसी से वे Business कर सकते हैं।

Types of electronic payment system

              1-    ATM Card (Debit Card)

2-    Credit Card

3-    Smart Card

4-    Internet Banking

 

            1-    ATM CARD (Debit Card) :-  Bank के दुआरा ग्राहक को दी जाने वाली एक सुविधा है .       बैंक अकाउंट खोलते ही सभी ग्राहक को बैंक ATM Card provide करती है . 

         जिसके उपयोग करके ग्राहक ATM से पैसे निकालने के साथ –साथ सभी प्रकार के online 

           Transaction भी कर सकता है ATM Card को ही Debit Card कहा जाता है .जिसके 

          Help से ग्राहक bill payment , Mobile recharge , and Mani Transfer जैसे विभिन्न 

          work कर सकते है .

2-    Credit Card  :-  जिस भी person की क्रेडिट स्कोर ज्यादा होती है उन ग्राहक को Bank के द्वारा दिया जाता है इस प्रकार के कार्ड का उपयोग ज्यादातर व्यापारी और प्राइवेट कंपनी के employee उपयोग करते है। क्रेडिट कार्ड के माध्यम से सभी प्रकार के ऑनलाइन खरीदारी या किसी भी प्रकार के बिल पेमेंट या मनी ट्रान्सफर के लिए कर सकता है।

यह एक प्रकार का उधार कार्ड होता है और इसके माध्यम से जो भी transaction करते है उसकी Process बैंक के पास जाती है और जितनी भी Payment करनी होती है वह Bank करता है। महीने के आखिर में Credit Card से जितनी भी Payment की जाती है उसका Bill उस व्यक्ति को Bank के द्वारा भेज दिया जाता है जिसे उस व्यक्ति को Bank को Payment करना होता है। 

इसमें आप जितनी भी Payment करना चाहे आप अपने क्रेडिट कार्ड के limit के अनुसार कर सकते है क्योकिं हर क्रेडिट कार्ड की एक लिमिट होती है क्रेडिट कार्ड की लिमिट बैंक के द्वारा उस व्यक्ति के मंथली earning के अनुसार रखती है और आपको इस बात का डर नहीं रहेगा की आपका Balance खत्म हो जायेगा लेकिन हाँ Bank इसके Bill भी Send करता है जिसे भरना जरूरी है।

          3-    Smart Card :- बैंक के द्वारा Account Holder को डेबिट एवम् क्रेडिट कार्ड की तरह स्मार्ट कार्ड 

         प्रदान किया जाता है। Smart Card एक प्रकार का प्लास्टिक कार्ड होता है जिस उपर Micro Processes 

                 Chip लगी होती और इस Chip पर Card धारक की विभिन्न जानकारी Store होती है Smart Card के माध्यम

         से Bank Account के साथ साथ Health Insurance, Transportation, Personal Identification जेंसी  

         Information भी Store की जा सकती है।


4-    Internet Banking :- ऑनलाइन बैंकिंग, बैंक के द्वारा ग्राहकों को दी जाने वाली एक सुविधा है तथा इस प्रकार के Electronic Payment System को नेट बैंकिंग एवम् ऑनलाइन बैंकिंग भी कहा जाता है। Internet Banking की सुविधा बैंक के माध्यम से प्रोवाइड किया जाता है जब यूजर बैंक में अकाउंट खोलता है बैंक के माध्यम से ऑनलाइन बैंकिंग का option प्रदान किया जाता है जिसे लेकर यूजर सभी प्रकार के बिल पेमेंट, ऑनलाइन transaction, मनी ट्रान्सफर इत्यादि सेवाएं यूजर घर बैठे उपयोग कर सकता है। इस सर्विस को इन्टरनेट बैंकिंग कहा जाता है।

इन्टरनेट बैंकिंग के माध्यम से बैंक अकाउंट होल्डर, अपने बैंक अकाउंट को इन्टरनेट के माध्यम से मोबाइल और कंप्यूटर में आसानी से मैनेज कर सकते है। ऑनलाइन बैंकिंग के माध्यम से घर बैठे खरीदारी और पैसे का ट्रान्सफर आसानी से कर सकता है।

Advantages and Disadvantages of electronic payment system


Advantages :-

        1-    Multiple Option

        2-    24x7 Day Services

        3-    Reducing Transaction Cost

 

1- Multiple Option:-

आज इन्टरनेट के समय में EPS के विभिन्न Option उपलब्ध है आप Electronic Payment System के लिए Internet Banking, मोबाइल बैंकिंग, डिजिटल वॉलेट UPI System जैसे Bhim, PhonePe, Google Pay इत्यादि के माध्यम से भी पेमेंट किया जा सकता है।

2- 24x7 Day Services:-

Electronic Payment करने के लिए आपको इस बात पर निर्भर नहीं होना पड़ता है की Bank खुला है या बंद है। बैंकों में पैसे की लेन-देन सप्ताह में केवल 6 दिन ही हो सकता है और एक दिन में केवल 8 घंटे तक ही लेन-देन हो सकता है। जबकि EPS के माध्यम से आप 24 घंटे सातों दिन आप उपयोग कर सकते है इसके माध्यम से पैसे का लेन-देन कर सकते है।

3- Reducing Transaction Cost:-

पहले पैसे जमा करने तथा निकालने के लिए लोगो को बैंक तक जाना पड़ता था अगर बैंक दूर में है तो बैंक तक जाने में ही बहुत सारें पैसे खर्च करने पड़ते थे लेकिन EPS के आने के बाद सभी प्रकार के Transaction(लेन-देन) घर बैठे कही से भी और कभी भी किया जा सकता है।

Disadvantages :-

       1-    Restrictions :-

       2-    The Risk of being hacked

1.Restrictions:-

EPS का उपयोग करके हम कई प्रकार के लाभ तो उठा सकते है लेकिन कई जगहों पर EPS में कई Restriction भी है जहाँ पर हम EPS का उपयोग नहीं कर सकते है भारत सरकार के EPS में transaction Limit भी रखा है जिसके कारण कई बार हमको बैंक जाने की जरुरत पड़ जाती है।

2.The risk of being hacked:-

EPS का उपयोग करना हमारे लिए जितना लाभदायक है उतना ही नुकसान हो सकता है क्योकिं Internet से जुड़े होने के कारण और हमारी गलती के कारण यहाँ पर कोई दूसरा व्यक्ति हमारी जानकारी चुराकर नुक्सान पहुंचा सकता है। और वह आपके Account में जितने भी रूपये होंगे उन्हें निकाल सकता है क्योकिं ऑनलाइन transaction करते समय कई बार हमको बैंक डिटेल तथा User id एवम् पासवर्ड को स्टोर करके रखना पड़ता है जिसके कारण हमारे एकाउंट के Hack होने के चांस भी बन सकता है जिसके कारण कई बार नुकसान भी हो सकता है .