CSS পরিচিতি ও প্রয়োগের পদ্ধতি

লেসন ১৬ / ৪৪

CSS কী?

CSS (Cascading Style Sheets) হলো ওয়েবপেজের চেহারা, ডিজাইন ও লেআউট নিয়ন্ত্রণের ভাষা। HTML কাঠামো দেয়, CSS সৌন্দর্য দেয়।

CSS এর Syntax

selector {
    property: value;
    property: value;
}

/* উদাহরণ */
h1 {
    color: blue;
    font-size: 32px;
    text-align: center;
}

CSS প্রয়োগের ৩টি পদ্ধতি

১. Inline CSS (সরাসরি tag-এ)

<h1 style="color: red; font-size: 24px;">শিরোনাম</h1>

⚠️ শুধু বিশেষ ক্ষেত্রে ব্যবহার করুন, reusable না।

২. Internal CSS (<style> ট্যাগে)

<head>
    <style>
        h1 { color: blue; }
        p { line-height: 1.6; }
    </style>
</head>

৩. External CSS (সেরা পদ্ধতি)

<!-- index.html -->
<head>
    <link rel="stylesheet" href="style.css">
</head>

/* style.css */
body {
    font-family: Arial, sans-serif;
    background: #f0f0f0;
}

Cascading ও Priority

একই element-এ একাধিক CSS rule থাকলে priority: Inline > Internal > External > Browser default

Specificity: !important > inline > ID (#) > class (.) > element (tag)

#main { color: red; }       /* 100 point */
.title { color: blue; }     /* 10 point */
h1 { color: green; }         /* 1 point */
/* ID সবচেয়ে শক্তিশালী */