Text in CSS

Text in CSS ka use web pages par text ko style aur format karne ke liye hota hai. Isme color, alignment, spacing, decoration aur effects sab control kiye ja sakte hain.


CSS Text Color

color property text ka color set karti hai.

Color define karne ke tarike:

  • color name (red, blue)
  • HEX (#ff0000)
  • RGB (rgb(255,0,0))

Default text color usually body me define hota hai.

Example:

Text in CSS

Text Color + Background Color

Text aur background dono set karke readability improve kar sakte ho.

Example:

Text Color + Background Color

Important: Text aur background ka contrast strong hona chahiye taki easily read ho sake.


Text in CSS Alignment

text-align text ko horizontal direction me align karta hai.

Values:

  • left
  • right
  • center
  • justify

Example:

CSS Text Alignment

Text Align Last

text-align-last last line ka alignment control karta hai.

Example:

Text Align Last

Vertical Alignment

vertical-align inline elements ka vertical position set karta hai.

Example:

Vertical Alignment

Text Direction

direction aur unicode-bidi text ka direction control karte hain.

Example:

Text Direction

CSS Text Decoration

Text ke upar lines add ya remove karne ke liye use hota hai.

Includes:

  • text-decoration-line
  • text-decoration-color
  • text-decoration-style
  • text-decoration-thickness

Decoration Line

Values:

  • none
  • underline
  • overline
  • line-through

Example:

Decoration Line


Decoration Color

Example:

Decoration Color


Decoration Style

Values:

  • solid
  • double
  • dotted
  • dashed
  • wavy

Example:

Decoration Style


Decoration Thickness

Example:

Decoration Thickness

Shorthand

Example:

Shorthand

Links Tip

Underline remove karne ke liye:

Links Tip

CSS Text Transform

Text ka case change karta hai.

Values:

  • uppercase
  • lowercase
  • capitalize

Example:

CSS Text Transform

CSS Text Spacing

Text spacing control karne ke liye multiple properties hoti hain.

Text Indent

First line ka space set karta hai.

Text Indent


Letter Spacing

Characters ke beech gap control karta hai.

Letter Spacing


 Line Height

Lines ke beech distance control karta hai.

Line Height

Word Spacing

Words ke beech gap control karta hai.

Word Spacing

White Space

Text wrapping control karta hai.

Values:

  • normal
  • nowrap
  • pre
  • pre-line
  • pre-wrap
White Space

CSS Text Shadow

text-shadow text me shadow effect add karta hai.


Basic Shadow

Basic Shadow

Shadow with Color

Shadow with Color

Shadow with Blur

Shadow with Blur

White Text Shadow

White Text Shadow

Neon Effect

Neon Effect

Multiple Shadows

Multiple Shadows

Text in CSS se tum text ka color, alignment, spacing, decoration aur effects sab easily control kar sakte ho. Ye web design ko clean, readable aur visually attractive banata hai.

Leave a Comment