ক্যাটাগরি ট্রিগার :

6/recent/ticker-posts

CSS কীভাবে HTML-এ ব্যবহার করা হয়?

July 19, 2025

 


✅ Step 1: CSS কীভাবে HTML-এ ব্যবহার করা হয়?

🔸 Example 1: Inline CSS (HTML ট্যাগের ভিতরে)


<p style="color: red;">এই লেখাটা লাল রঙে</p>

🔸 Example 2: Internal CSS (একই ফাইলে <style> ট্যাগে)


<!DOCTYPE html>
<html>
<head>
  <style>
    p {
      color: blue;
      font-size: 20px;
    }
  </style>
</head>
<body>
  <p>এই লেখাটা নীল রঙে</p>
</body>
</html>

🔸 Example 3: External CSS (ভিন্ন .css ফাইল ব্যবহার করে)

🔹 index.html


<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <h1>আমার ওয়েবসাইট</h1>
</body>
</html>

🔹 style.css


h1 {
  color: green;
  text-align: center;
}

✅ Step 2: CSS এর কিছু মুলভিত্তি

CSS প্রপার্টিকাজ
colorটেক্সটের রঙ
background-colorব্যাকগ্রাউন্ড রঙ
font-sizeফন্টের আকার
text-alignটেক্সটের অবস্থান (বাম/মাঝে/ডান)
paddingভিতরের ফাঁকা জায়গা
marginবাইরের ফাঁকা জায়গা
borderবর্ডার যুক্ত করে

🎯 চলো, একটি ছোট ডিজাইন প্রজেক্ট করি:

🔸 Example: কালারফুল বক্স ডিজাইন


<!DOCTYPE html>
<html>
<head>
  <style>
    .box {
      background-color: orange;
      color: white;
      padding: 20px;
      margin: 30px;
      border-radius: 10px;
      text-align: center;
      font-size: 24px;
    }
  </style>
</head>
<body>
  <div class="box">এইটা একটা CSS বক্স</div>
</body>
</html>

আপনার প্রিয়জনের সাথে শেয়ার করুন

আপনার মন্তব্য পোস্ট করুন

0 Comments