সিএসএস-এ তালিকা এবং সারণি ফর্ম্যাট করার নির্দেশিকা- বৈশিষ্ট্য এবং উদাহরণ

ফর্ম্যাটিং তালিকা এবং টেবিল আপনার ওয়েবসাইটে তথ্য প্রদর্শনের একটি অপরিহার্য অংশ। CSS আপনার পছন্দ অনুযায়ী তালিকা এবং টেবিল তৈরি এবং কাস্টমাইজ করার জন্য বৈশিষ্ট্য এবং ক্লাস প্রদান করে। সিএসএস-এ তালিকা এবং টেবিলগুলি কীভাবে ফর্ম্যাট করতে হয় সে সম্পর্কে এখানে একটি বিশদ নির্দেশিকা রয়েছে।

 

ফরম্যাটিং তালিকা

অবিন্যস্ত তালিকা(উল)

প্রধান সম্পত্তি: তালিকা-শৈলী-টাইপ।

মান none, disc, circle, square:।

উদাহরণ:

ul {  
  list-style-type: disc;  
}  

অর্ডার করা তালিকা(ol)

প্রধান সম্পত্তি: তালিকা-শৈলী-টাইপ।

মান: কিছুই নয়(ডিফল্ট), দশমিক, নিম্ন-আলফা, উচ্চ-আলফা, নিম্ন-রোমান, উচ্চ-রোমান।

উদাহরণ:

ol {  
  list-style-type: decimal;  
}  

সংজ্ঞা তালিকা(dl)

প্রধান সম্পত্তি: সংজ্ঞা তালিকা ফর্ম্যাট করার জন্য কোন নির্দিষ্ট CSS সম্পত্তি নেই। যাইহোক, আপনি ক্লাস বা অন্যান্য বৈশিষ্ট্য যেমন ব্যবহার করে তালিকার মধ্যে উপাদান স্টাইল করতে পারেন font-size, font-weight, margin, padding, etc.

উদাহরণ:

<dl>  
  <dt>HTML</dt>  
  <dd>A markup language for creating web pages</dd>  
  <dt>CSS</dt>  
  <dd>A styling language for web pages</dd>  
</dl>  

dt {  
  font-weight: bold;  
}  

 

ফর্ম্যাটিং টেবিল

টেবিল গঠন বিন্যাস

প্রধান সম্পত্তি: border-collapse.

মান: separate(default), collaps ই.

উদাহরণ:

table {  
  border-collapse: collapse;  
}  

টেবিল সীমানা বিন্যাস

প্রধান সম্পত্তি: border.

মান: একটি সীমানা মান, উদাহরণস্বরূপ: 1px solid black.

উদাহরণ:

table {  
  border: 1px solid black;  
}  

সেল বর্ডার ফরম্যাটিং

প্রধান সম্পত্তি: border.

মান: একটি সীমানা মান, উদাহরণস্বরূপ: 1px solid black.

উদাহরণ:

td, th {  
  border: 1px solid black;  
}  

সারণি কোষের সারিবদ্ধকরণ এবং ব্যবধান

প্রধান বৈশিষ্ট্য: text-align, padding.

• টেক্সট-সারিবদ্ধ: প্রান্তিককরণ মান, উদাহরণস্বরূপ: left, right, center.
• প্যাডিং: কক্ষের মধ্যে ব্যবধান মান, উদাহরণস্বরূপ: 10px।

উদাহরণ:

th {  
  text-align: center;  
  padding: 10px;  
}  

টেবিলে পটভূমি এবং পাঠ্যের রঙ

প্রধান বৈশিষ্ট্য: background-color, color

• background-color: পটভূমির রঙের মান, উদাহরণস্বরূপ: lightgray.
• color: পাঠ্য রঙের মান, উদাহরণস্বরূপ: white.

উদাহরণ:

table {  
  background-color: lightgray;  
  color: white;  
}  

টেবিলে কলাম এবং সারির আকার

প্রধান বৈশিষ্ট্য: width, height.

• width: প্রস্থ মান, উদাহরণস্বরূপ: "100px", "20%"।
• height: উচ্চতার মান, উদাহরণস্বরূপ: "50px", "10%"।

উদাহরণ:

th {  
  width: 100px;  
  height: 50px;  
}  

 

এটি সিএসএস-এ তালিকা এবং টেবিলগুলি কীভাবে ফর্ম্যাট করতে হয় তার একটি বিস্তৃত নির্দেশিকা। আপনি আপনার ওয়েবসাইটে আপনার ডিজাইনের প্রয়োজন অনুসারে তালিকা এবং টেবিল শৈলী তৈরি করতে মান এবং বৈশিষ্ট্যগুলি কাস্টমাইজ করতে পারেন।