Ticker

6/recent/ticker-posts

What Is HTML Styles In Hindi?

2.4 Wireless June 17, 2021

Introduction of HTML Styles



HTML Style क्या हैं?

HTML में Style का अर्थ बनावट या सजाना होता हैं अर्थात किसी वेबपेज को style करना। HTML में Style का उपयोग करके वेबपेजेस को डिज़ाइन किया जा सकता हैं। परन्तु style करने के लिए CSS का उपयोग किया जाता हैं। लेकिन HTML की हेल्प से आप कुछ सीमा तक एक HTML वेबपेज को अपने तरीके से स्टाइल कर सकते हैं।

आप HTML style का उपयोग करके Font चेंज करना, Background Change करना, Background change और Text Color Change कर सकते हैं।

HTML द्वारा वेबपेज को दो तरह से स्टाइल कर सकते हैं :

  1. HTML style टैग द्वारा स्टाइल करना
  2. style एट्रिब्यूट द्वारा स्टाइल करना


Style tag द्वारा स्टाइल करना

style टैग को HTML पेज के हेड सेक्शन में परिभाषित किया जाता हैं और कुछ style नियम को परिभाषित किया जाता हैं।

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style Tag</title>
          <style>
               h1{
                    color: red;
               }
               p{
                    color: green;
               }
          </style>
     </head>
     <body>
          <h1>2.4 Wireless</h1>
          <p>Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog


Style attribute द्वारा स्टाइल करना

style attribute उपयोग HTML में स्टाइल को परिभाषित करने के लिए ही किया जाता हैं। style टैग द्वारा आप एक बार में ही सभी एलिमेंट की स्टाइल इनफार्मेशन परिभाषित कर सकते हैं। लेकिन style attribute द्वारा प्रत्येक एलिमेंट में अलग-अलग स्टाइल इनफार्मेशन परिभाषित करना पड़ता हैं।

Syntax of Style Attribute :

<tagname style="property: value;">

ऊपर दिए गए सिंटेक्स में property एक CSS प्रॉपर्टी हैं और value एक CSS वैल्यू हैं।

आप अगले आर्टिकल में CSS के बारे में विस्तार में जानेंगे। HTML CSS

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body style="text-align: center;">
          <h1 style="color: red;">2.4 Wireless</h1>
          <p style="color: green;">Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog



Style attribute द्वारा Fonts Change करना

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body>
          <h1 style="font-family: courier;">2.4 Wireless</h1>
          <p style="font-family: verdana;">Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog



Style attribute द्वारा Background Color करना

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body style="background-color: blue;">
          <h1>2.4 Wireless</h1>
          <p>Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog



Style attribute द्वारा Text Color करना

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body>
          <h1 style="color: red;">2.4 Wireless</h1>
          <p style="color: green;">Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog



Style attribute द्वारा Text Size करना

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body>
          <h1 style="font-size: 30px;">2.4 Wireless</h1>
          <p style="font-size: 20px;">Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog



Style attribute द्वारा Text Alignment करना

उदाहरण :

<!DOCTYPE html>
<html>
     <head>
          <title>Example of style attribute</title>
     </head>
     <body style="text-align: center;">
          <h1>2.4 Wireless</h1>
          <p>Welcome to My Blog</p>
     </body>
</html>

Output :

2.4 Wireless

Welcome to My Blog


Tags:

Post a Comment

0 Comments