← Back to HTML Course | Chapter 4: Semantics & Entities | Lesson 3 of 10

HTML Entities

सोचिए आप HTML tags के बारे में एक manual लिख रहे हैं। आप अपने webpage पर '<' और '>' characters को plain text के रूप में display करना चाहते हैं। लेकिन browser उन characters को एक नया tag शुरू करने के निर्देश के रूप में पढ़ता है, जिससे आपका page layout टूट सकता है। HTML entities reserved characters के लिए code names या keyboard shortcuts की तरह हैं। ये आपको उन characters को safely display करने देते हैं जिनका HTML में special meaning होता है, बिना browser को confuse किए। ये आपको standard keyboards पर न मिलने वाले symbols, जैसे copyright signs या currency symbols, को भी simple codes का उपयोग करके insert करने देते हैं।

In this page:

  1. Reserved Characters
  2. Non-Breaking Space (nbsp)
  3. Currency Symbols
  4. Trademark और Copyright Symbols
  5. कई Entities को सुरक्षित तरीके से Combine करना
  6. आम HTML Entities की Reference Table
  7. Numeric बनाम Named Entities बनाम Unicode
Syntax
markup 
&entity_name;
&#entity_number;

Reserved Characters

<, >, और & जैसे characters tags parse करने के लिए HTML द्वारा reserved होते हैं। इन characters को अपने webpage पर plain text के रूप में दिखाने के लिए, आपको इन्हें उनके संबंधित HTML entity codes से बदलना होगा।

Note: सभी HTML entities एक ampersand (&) से शुरू होकर एक semicolon (;) पर खत्म होते हैं।
Warning: less-than sign (<) को escape न करने से browser आपके text को एक टूटे हुए HTML tag समझ सकता है।

उदाहरण: Reserved Characters

markup 
<p>Use &lt;div&gt; to create a division, and &amp; for an ampersand.</p>

Non-Breaking Space (nbsp)

सामान्य तौर पर, browsers आपके कोड में कई spaces को एक ही space में collapse कर देते हैं। non-breaking space entity (&nbsp;) browser को आपके spaces collapse करने से रोकता है और साथ में मौजूद शब्दों को नई लाइन में टूटने से बचाता है।

Note: माप की इकाइयों या छोटी तारीखों को एक ही लाइन में साथ रखने के लिए non-breaking spaces इस्तेमाल करें।
Warning: बड़े layout margins बनाने के लिए &nbsp; को बार-बार उपयोग करने से बचें; इसके बजाय CSS margins का उपयोग करें।

उदाहरण: The Non-Breaking Space (nbsp)

markup 
<p>10&nbsp;km</p>

Currency Symbols

चूंकि standard keyboards में Euros, Pounds, या Yen जैसी विदेशी currencies की keys नहीं होतीं, HTML आपके page पर इन currency symbols को साफ तरीके से दिखाने के लिए आसान entity codes provide करता है।

Note: currency symbols render करने के लिए आप named entity (जैसे &euro;) या numbered entity (जैसे &#8364;) दोनों में से कोई भी इस्तेमाल कर सकते हैं।
Warning: अपने currency codes को दोबारा जांचें, ताकि आपकी pricing tables सही symbols दिखाएं।

उदाहरण: Currency Symbols

markup 
<p>&euro;20, &pound;15, &yen;500</p>

Trademark और Copyright Symbols

Branding और legal protection के लिए trademark और copyright symbols जोड़ना जरूरी है। HTML इन standard legal characters को render करने के लिए सरल, universally supported entities provide करता है।

Note: अपने page footer में जल्दी से copyright symbol जोड़ने के लिए named entity &copy; इस्तेमाल करें।
Warning: इन codes को हमेशा lowercase में लिखें, ताकि ये पुराने mobile browsers पर सही तरीके से render हों।

उदाहरण: Trademark and Copyright Symbols

markup 
<p>&copy; 2024 MyCompany&trade;</p>

कई Entities को सुरक्षित तरीके से Combine करना

आप अपने page layout को बिगाड़े बिना mathematical formulas, technical explanations, या legal notices लिखने के लिए कोड की एक ही लाइन में कई HTML entities इस्तेमाल कर सकते हैं।

Note: entities के घने blocks लिखते समय spacing और line breaks इस्तेमाल करके अपना कोड साफ रखें।
Warning: सुनिश्चित करें कि हर entity में closing semicolon शामिल हो, ताकि rendering bugs से बचा जा सके।

उदाहरण: Combining Multiple Entities Safely

markup 
<p>5 &lt; 10 &amp; 10 &gt; 5</p>

आम HTML Entities की Reference Table

रोज़मर्रा के HTML में कुछ entities बार-बार आती हैं: ampersand के लिए &amp;, angle brackets के लिए &lt; और &gt;, straight double quote के लिए &quot;, copyright symbol के लिए &copy;, और non-breaking space के लिए &nbsp;।

इन कुछ को याद रखना असल दुनिया के ज्यादातर मामलों को कवर कर लेता है।

Note: fractions या arrows जैसे कम इस्तेमाल होने वाले symbols के लिए, जिन्हें आप दिल से याद नहीं रख पाएंगे, एक पूरी HTML entity reference chart bookmark कर लें।
Warning: search query URL जैसे href के अंदर literal ampersand को &amp; के रूप में escape करना भूल जाना कुछ browsers में चुपचाप link को तोड़ सकता है।

उदाहरण: Common HTML Entities Reference Table

markup 
<p>&amp; &lt; &gt; &quot; &copy; &nbsp;</p>

Numeric बनाम Named Entities बनाम Unicode

&copy; जैसा named entity पढ़ने और याद रखने में आसान है। &#169; जैसा numeric entity उसी character को उसके Unicode code point number का इस्तेमाल करके represent करता है, और यह पुराने systems में भी काम करता है जो हर named entity को न पहचान पाएं।

चूंकि modern फ़ाइलें UTF-8 में save होती हैं, आप अक्सर असली Unicode character, जैसे © सीधे टाइप कर सकते हैं और entities को पूरी तरह छोड़ सकते हैं।

Note: UTF-8 में save की गई modern websites के लिए, असली character सीधे टाइप करना, जैसे © या ★, आमतौर पर ठीक काम करता है और entity codes याद रखने से कहीं आसान है।
Warning: आपकी file encoding चाहे कितनी भी modern क्यों न हो, HTML के अपने reserved characters जैसे < और & के लिए entities हमेशा जरूरी बने रहते हैं — इन्हें हमेशा escape किया जाना चाहिए।

उदाहरण: Numeric vs Named Entities vs Unicode

markup 
<p>&copy; is the same as &#169; is the same as ©</p>
Live Example
Related Topics

HTML Style Guide · HTML Symbols · HTML Semantics · HTML Emojis

{# common_mistakes/chapter_summary/browser_support: on Hindi pages the view already swaps in the hi_ translation fields (or blanks these out if untranslated), so this renders correctly for both languages without a lang_code check here. #}
🔒

Chapter Quiz — Complete all 10 topics to unlock

0/10 topics done

Complete these topics first:

← Previous Lesson HTML Style Guide Next Lesson → HTML Symbols

Login to run this code

C/C++/Java/PHP execution requires a free account. Your code is saved — you'll land right back in the editor after logging in.