CSS (Cascading Style Sheets) Kya Hai?

Web Pages ko Khubsurat Banana Sikhein

CSS ka Introduction

CSS ka pura naam Cascading Style Sheets hai. Yeh ek stylesheet language hai jiska use HTML elements ko style karne ke liye hota hai. Simply put, agar HTML webpage ka structure (dhaancha) hai, toh CSS uski skin (sajawat) hai. CSS se aap colors, fonts, spacing, layout, aur bohot kuch control kar sakte hain.

CSS ko isliye banaya gaya tha taaki presentation (kaise dikhega) aur content (kya hai) ko alag rakha ja sake. Isse code maintain karna aasan ho jaata hai.

CSS Syntax

CSS ka syntax bohot simple hai. Isme ek selector hota hai aur ek declaration block.

Selector: Yeh us HTML element ko target karta hai jise aap style karna chahte hain (e.g., h1, .my-class).
Declaration Block: Isme ek ya zyada declarations hoti hain jo curly braces se ghiri hoti hain. Har declaration me ek CSS property aur uski value hoti hai, jo colon (:) se separate hoti hai.

selector {
  property: value; /* Ek declaration */
  property2: value2;
}

Example:

h1 {
  color: blue;
  font-size: 24px;
}

Yeh code sabhi <h1> elements ka color blue aur font size 24 pixels kar dega.

CSS Ko HTML Me Kaise Add Karein?

CSS ko HTML me add karne ke 3 tarike hain:

External CSS: Yeh sabse accha tarika hai. CSS code ko ek alag .css file me likha jaata hai aur use <link> tag ke through HTML file ke <head> section me link kiya jaata hai.
```
<link rel="stylesheet" href="styles.css">
```
Internal CSS: CSS ko <style> tag ke andar, HTML file ke <head> section me likha jaata hai. Yeh sirf uss particular page ke liye hota hai.
```
<style>
  body {
    background-color: lightblue;
  }
</style>
```
Inline CSS: CSS ko સીધા HTML element ke style attribute me likha jaata hai. Iska use kam se kam karna chahiye.
```
<h1 style="color:red; text-align:center;">This is a Heading</h1>
```

Key Takeaways

CSS ka use web pages ko style karne ke liye hota hai.
Yeh content aur presentation ko separate karta hai.
CSS me selectors aur declaration blocks hote hain.
CSS ko 3 tariko (External, Internal, Inline) se add kiya ja sakta hai, jisme External best practice hai.

Test Your Knowledge!

Kya aap CSS ke basics seekh chuke hain? Chaliye dekhte hain!

Apni knowledge test karne ke liye is quick quiz ko dein.

Start Quiz