কীভাবে একটি একক উপাদানে দুটি সিএসএস ক্লাস প্রয়োগ করা যায়

Question

আমি কি একটি একক ডিভ বা স্প্যান বা কোনও এইচটিএমএল উপাদানগুলিতে 2 টি ক্লাস প্রয়োগ করতে পারি? উদাহরণ স্বরূপ:

<a class="c1" class="c2">aa</a>

আমি চেষ্টা করেছি এবং আমার ক্ষেত্রে সি 2 প্রয়োগ হয় না। আমি কীভাবে একসাথে উভয় ক্লাস প্রয়োগ করতে পারি?

Answer 1

1) ক্লাস অ্যাট্রিবিউটের ভিতরে একাধিক ক্লাস হোয়াইটস্পেস ( রেফ ) দ্বারা পৃথক করে ব্যবহার করুন :

<a class="c1 c2">aa</a>

২) নির্দিষ্ট শ্রেণীর সমস্ত উপাদান থাকা উপাদানগুলিকে লক্ষ্য করতে, এই সিএসএস নির্বাচকটি ব্যবহার করুন ( কোনও স্থান নেই ) ( রেফ )

.c1.c2 {
}

Answer 2

উভয় শ্রেণীর স্ট্রিংকে একটি একক শ্রেণির বৈশিষ্ট্য মানের মধ্যে অন্তর্ভুক্ত করে অন্তর্ভুক্ত করুন।

<a class="c1 c2" > aa </a>

Answer 3

অন্যরা যেমন উল্লেখ করেছে, আপনি কেবল একটি স্থান দিয়ে এগুলি সীমাবদ্ধ করে দিন।

তবে নির্বাচকরা কীভাবে কাজ করেন তা জেনে রাখাও দরকারী।

এইচটিএমএলের এই অংশটি বিবেচনা করুন ...

<div class="a"></div>
<div class="b"></div>
<div class="a b"></div>

.a { ... }নির্বাচক হিসাবে ব্যবহার করে প্রথম এবং তৃতীয়টি নির্বাচন করবে। তবে, আপনি যদি এমন দুটি নির্বাচন করতে চান যা উভয় aএবং bআপনি নির্বাচকটি ব্যবহার করতে পারেন .a.b { ... }। মনে রাখবেন যে এটি আই 6 এ কাজ করবে না, এটি কেবল .b(শেষটি) নির্বাচন করবে ।

Answer 4

<a class="c1 c2">aa</a>

Answer 5

এটি খুব পরিষ্কার যে একক ডিভিতে দুটি ক্লাস যুক্ত করতে প্রথমে আপনাকে ক্লাসগুলি তৈরি করতে হবে এবং তারপরে তাদের একত্রিত করতে হবে। এই প্রক্রিয়াটি পরিবর্তন করতে এবং নম্বর হ্রাস করতে ব্যবহৃত হয়। ক্লাসের। যারা স্ক্র্যাচ থেকে ওয়েবসাইট তৈরি করেন তারা বেশিরভাগ ক্ষেত্রে এই জাতীয় পদ্ধতি ব্যবহার করেন। তারা দুটি শ্রেণি তৈরি করে প্রথম শ্রেণি রঙের জন্য এবং দ্বিতীয় শ্রেণি প্রস্থ, উচ্চতা, ফন্ট-স্টাইল ইত্যাদি নির্ধারণের জন্য হয় we

.color
{background-color:#21B286;}
.box
{
  width:"100%";
  height:"100px";
  font-size: 16px;
  text-align:center;
  line-height:1.19em;
}
.box.color
{
width:"100%";
height:"100px";
font-size:16px;
color:#000000;
text-align:center;
}

<div class="box color">orderlist</div>

Answer 6

একটি স্থান দিয়ে তাদের আলাদা করুন।

<div class="c1 c2"></div>

Answer 7

.color
{background-color:#21B286;}
.box
{
  width:"100%";
  height:"100px";
  font-size: 16px;
  text-align:center;
  line-height:1.19em;
}
.box.color
{
width:"100%";
height:"100px";
font-size:16px;
color:#000000;
text-align:center;
}

<div class="box color">orderlist</div>

.color
{background-color:#21B286;}
.box
{
  width:"100%";
  height:"100px";
  font-size: 16px;
  text-align:center;
  line-height:1.19em;
}
.box.color
{
width:"100%";
height:"100px";
font-size:16px;
color:#000000;
text-align:center;
}

<div class="box color">orderlist</div>

.color
{background-color:#21B286;}
.box
{
  width:"100%";
  height:"100px";
  font-size: 16px;
  text-align:center;
  line-height:1.19em;
}
.box.color
{
width:"100%";
height:"100px";
font-size:16px;
color:#000000;
text-align:center;
}

<div class="box color">orderlist</div>

Comments

যদিও এটি প্রশ্নের উত্তর দিতে পারে, আপনার কোডটি কী করে এবং এটি কেন প্রাথমিক সমস্যার সমাধান করে তা দয়া করে একটি সংক্ষিপ্ত ব্যাখ্যাও যুক্ত করুন।

— ব্যবহারকারী 1438038