HTML Styles

HTML Styles का उपयोग HTML elements के appearance और presentation को control करने के लिए किया जाता है।

Styles की मदद से आप text का color, size, background, alignment और layout change कर सकते हैं। HTML में styling के लिए CSS (Cascading Style Sheets) का उपयोग किया जाता है।

HTML में Style Attribute

HTML में directly styling apply करने के लिए style attribute का use किया जाता है।

Format:

<tag style="property:value;">

Example:

<p style="color:red;">This is red text</p>

Common CSS Properties in HTML Styles

1. Text Color

<p style="color:blue;">Blue Text</p>

2. Background Color

<p style="background-color:yellow;">Highlighted text</p>

3. Font Size

<p style="font-size:20px;">Large Text</p>

4. Font Family

<p style="font-family:Arial;">Arial Font</p>

5. Text Alignment

<p style="text-align:center;">Centered Text</p>

Multiple Styles in One Tag

एक element पर multiple styles apply की जा सकती हैं।

Example:

<p style="color:white; background-color:black; font-size:18px;">
Styled Paragraph
</p>

HTML Styles और Best Practices

हालाँकि HTML में inline styles possible हैं, लेकिन:

  • Inline styles maintain करना difficult होता है
  • Large projects में reuse possible नहीं होता
  • SEO और performance पर impact पड़ सकता है

Best practice:

  • Styling के लिए external CSS use करें
  • HTML को structure तक limited रखें

HTML Styles vs HTML Formatting Tags

FeatureHTML StylesFormatting Tags
ControlHighLimited
FlexibilityHighLow
RecommendedYes (via CSS)Limited use

HTML Background Styling

<body style="background-color:lightgray;">

लेकिन real projects में background styling CSS file में define करनी चाहिए।

HTML Style Attribute और SEO

SEO perspective से:

  • Clean HTML structure maintain करें
  • Inline styles का overuse avoid करें
  • Semantic HTML elements prefer करें

Search engines structure और content को priority देते हैं, styling को नहीं।

Common Beginner Mistakes

  • हर element में inline style लगाना
  • Same style बार-बार repeat करना
  • Structure और style mix करना
  • CSS को ignore करना

Quick Summary

  • HTML styles presentation control करते हैं
  • style attribute inline CSS apply करता है
  • Multiple CSS properties एक साथ use हो सकती हैं
  • Best practice external CSS है

Practice Questions

  1. HTML styles क्या होते हैं?
  2. Inline style क्या है?
  3. Inline CSS क्यों avoid करनी चाहिए?
Share your love

Related Posts