HTML class বৈশিষ্ট্য

সংজ্ঞা ও ব্যবহার

class এই বৈশিষ্ট্যটি ইলেকট্রনিক এলিমেন্টের ক্লাস নাম (classname) নির্দিষ্ট করে

class প্রধানত, এই বৈশিষ্ট্যটি শৈলীসূচীর ক্লাস (class) তে ইঙ্গিত করার জন্য ব্যবহৃত হয়। কিন্তু, এটি জেভাস্ক্রিপ্ট (HTML DOM) দ্বারা নির্দিষ্ট ক্লাস সহ একটি HTML ইলেকট্রনিক এলিমেন্টটি পরিবর্তন করার জন্যও ব্যবহৃত হতে পারে。

আরও দেখুন:

HTML শিক্ষাক্রমHTML অ্যাট্রিবিউট

CSS শিক্ষাক্রমCSS গ্রামাটিক

CSS পরিচ্ছেদCSS .class সিলেক্টর

HTML DOM পরিচ্ছেদHTML DOM getElementsByClassName() মথড

HTML DOM পরিচ্ছেদHTML DOM className অ্যাট্রিবিউট

HTML DOM পরিচ্ছেদHTML DOM classList অ্যাট্রিবিউট

HTML DOM পরিচ্ছেদHTML DOM Style অবজেক্ট

প্রকল্প

উদাহরণ 1

এলিমেন্টের জন্য class অ্যাট্রিবিউট ব্যবহার করে হলে এইভাবে করুন:

<html>
<head>
<style>
h1.intro {
  color: blue;
}
p.important {
  color: green;
}
</style>
</head>
<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">দৃষ্টি দিন, এটা একটি গুরুত্বপূর্ণ অনুচ্ছেদ হল:）</p>
</body>
</html>

স্বয়ংক্রিয় প্রয়াস

পৃষ্ঠার নীচে আরও উদাহরণ পাবেন。

বিন্যাস

<element class="classname">

প্রতিভাত্ত্ব

মান বর্ণনা
classname

এলিমেন্টের জন্য একটি বা বেশ কয়েকটি ক্লাস নাম নির্দিষ্ট করুন。

যদি বেশ কয়েকটি ক্লাস নির্দিষ্ট করতে হয়, তবে ক্লাস নামগুলোকে স্পেস দিয়ে পৃথক করুন。

এটা একটি এলিমেন্টের জন্য বেশ কয়েকটি সিএসএস ক্লাস যোগ করার অনুমতি দেয়。

যেমন: <span class="left important">

নামকরণ নিয়ম:

  • এটা A-Z বা a-z-এর সাথে শুরু করতে হবে
  • যেমন: অক্ষর (A-Za-z)、সংখ্যা (0-9)、হাইফেন ("-") এবং হাইফেন ("_")

আরও উদাহরণ

উদাহরণ 2

একটি এলিমেন্টে বেশ কয়েকটি ক্লাস যোগ করুন:

<!DOCTYPE html>
<html>
<head>
<style>
h1.intro {
  color: blue;
  text-align: center;
}
.important {
  background-color: yellow;
}
</style>
</head>
<body>
<h1 class="intro important">শিরোনাম 1</h1>
<p>একটি অনুচ্ছেদ。</p>
</body>
</html>

স্বয়ংক্রিয় প্রয়াস

উদাহরণ 3

জেভাস্ক্রিপ্ট দিয়ে প্রথম class="example" এলিমেন্টে (ইনডেক্স ০) হলুদ পটভূমির রঙ যোগ করুন。

let x = document.getElementsByClassName("example");
x[0].style.backgroundColor = "yellow";

স্বয়ংক্রিয় প্রয়াস

উদাহরণ 4

JavaScript ব্যবহার করে "mystyle" ক্লাস যোগ করুন id হল "myDIV" এর উপাদান:

document.getElementById("myDIV").classList.add("mystyle");

স্বয়ংক্রিয় প্রয়াস

ব্রাউজার সমর্থন

চ্রোম এজ ফায়ারফক্স স্যাফারি ওপেরা
চ্রোম এজ ফায়ারফক্স স্যাফারি ওপেরা
সমর্থন সমর্থন সমর্থন সমর্থন সমর্থন