Monday 17 July 2017

HTML text formatting and styles...


HTML text formatting and styles 

  • Introduction to HTML text formatting in Hindi 
  • Types of HTML text formatting in Hindi 
  • Styling HTML text in Hindi 


Introduction to HTML text formatting 

HTML में कुछ tags सिर्फ text formatting के लिए provide किये गए है। इन tags का इस्तेमाल करते हुए आप web page पर text की presentation और position को control कर सकते है। जैसे की आप text को bold या underline कर सकते है। किसी text editor में आप ये काम एक button click से कर सकते है लेकिन HTML में इसके लिए आप tags यूज़ करते है। कुछ common formatting type है जो आप text पर apply करते है इनकी list नीचे दी जा रही है।

  1. Bold
  2. Italic
  3. Underline
  4. Marked
  5. Superscript 
  6. Subscript
  7. Small
  8. Deleted


HTML <b> tag
HTML के द्वारा किसी text को bold करने के लिए <b> tag यूज़ किया जाता है। इसके लिए आप starting और ending tags के beech में text को लिखते है।

<b> This text will be bolded. </b>


HTML <i> tag
HTML में किसी text को italic बनाने के लिए <i> tag यूज़ किया जाता है। 

<i> This text will be italic. </i>


HTML <ins> tag
किसी text को underline करने के लिए <ins> tag यूज़ किया जाता है। 

<ins> This text will be underlined</ins>

HTML <mark> tag
यदि आप किसी text को highlight करना चाहते है तो उसके लिए <mark> tag यूज़ कर सकते है।  

<mark> This text will be highlighted </mark>


HTML <sup> tag
किसी text को super script करने के लिए आप <sup> tag यूज़ कर सकते है।

<p> This is normal text<sup> This will be super scripted </sup> This is normal again </p>


HTML <sub> tag
अगर आप text को subscript में लाना चाहते है तो उसके लिए आप <sub> tag यूज़ करेंगे।  

<p> This is normal text <sub> This text will be subscripted </sub></p>


HTML <small> tag
यदि आप किसी text को दूसरे text से छोटा रखना चाहते है तो इसके लिए आप <small> tag  यूज़ कर सकते है। कई editors ऐसा text को highlight करने के लिए भी करते है। 

<p> Normal Text <small> Smal Text </small> </p>


HTML <del> tag
किसी text को deleted शो करने के लिए आप <del> tag का इस्तेमाल कर सकते है। जब किसी tag को deleted show करते है तो उस text के through line show होती है। 

<p> <del> This text will be deleted</del></p>


HTML text formatting tag का एक complete उदाहरण नीचे दिया जा रहा है।

<html>
<head>
<title>Text Formatting</title>
</head>
<body>
<p>
<b> This text will be bolded. </b> 
</p>
<p>
<i> This text will be italic. </i>
</p> 
<p>
<ins> This text will be underlined</ins>
</p> 
<mark> This text will be highlighted </mark>
<p> This is normal text<sup> This will be super scripted </sup> This is normal again </p>
<p> This is normal text <sub> This text will be subscripted </sub></p>
<p> Normal Text <small> Smal Text </small> </p>
<p> <del> This text will be deleted</del></p>
</body>
</html> 

ऊपर दी गयी script को run करने पर web page इस प्रकार show होगा।
















Changing text color

किसी भी tag के text का color change करने के लिए आप CSS की color property यूज़ करते है। और इसके बाद colon लगाकर color का नाम देते है। 
   
<p style="color:red">This text will be red. </p>


Changing font family 

Text की font family change करने के लिए आप font family property यूज़ करते है और value के रूप में font family का नाम देते है।

<p style="font-family:Arial"> This text will be in Arial </p>


Changing text size 

Text की size change करने के लिए आप font size property यूज़ करते है और value के रूप में जो size आप चाहते है वह देते है।

<p style="font-size: 45"> This size is changed by style tag. </p>


Changing text position 

Text की position change करने के लिए text align property यूज़ की जाती है और value के रूप में आप left, right या center pass कर सकते है।

<p style="text-align:center"> This position is change by style tag</p>


इसका उदाहरण नीचे दिया जा रहा है।

<html>
<head>
<title>Text Formatting</title>
</head>
<body>
<p style="color:red">This text will be red. </p>

<p style="font-family:Arial"> This text will be in Arial </p>

<p style="font-size: 45"> This size is changed by style tag. </p>

<p style="text-align:center">
This position is changed by style tag.
</p>

</body>
</html>

ऊपर दी गयी script निचे दिया गया web page generate करेगी।










यदि आपके मन में कोई सवाल है तो हमसे सम्पर्क करें. यदि आपको हमारा Blog पसंद आया तो Subscribe करना न भूले इससे आपको आगे Hindi Blog की नयी-नयी जानकारी आपके Email पर मिलती रहेगी.

Created By Manjeet Singh...

No comments:

Post a Comment

Explanation | Booting of Computer – Warm and Cold Booting | Learn About Computers |

Hello Everyone, Am Manjeet Singh and Today we will Discuss About  Booting of Computer – Warm and Cold Booting...  So Let's Start... ...