CSS Border

কোন একটি element এর চারপাশে বর্ডার তৈরি করতে border ব্যবহার করা হয়।আগে নিচের উদাহরণটি দেখুন তারপর ব্যাখ্যা করছিঃ

ফলাফল

এখানে 1px হল border-width অর্থাৎ বর্ডার লাইনটি 1 pixel মোটা হবে, solid হল border-style, বর্ডার স্টাইল solid দিয়ে বুঝানো হয়েছে লাইনটা solid হবে, red হল border-color যা বর্ডার লাইনের কালার নির্ধারন করে. এখানে যেই সিকুয়েন্সে বর্ডারের প্রোপার্টিগুলা লিখা হল সেগুলো যে এইভাবেই লিখতে হবে ব্যাপারটা কিন্তু তা নয়। আপনি 

border: 1px solid red;

নিচের মত যেকোন একভাবে লিখতে পারেনঃ

border: solid 1px red;

অথবা

border: solid red 1px;

অথবা

border: 1px red solid;

অর্থাৎ যেকোন সিকুয়েন্সে আপনি লিখতে পারেন। আবার নিচের মতও লিখতে পারেনঃ

#border{
   border-style: solid;
   border-width: 1px;
   border-color: red;
 }

এখানে আমরা শুধুমাত্র solid টাইপের বর্ডার স্টাইল নিয়ে কথা বলেছি। আপনি চাইলে নিচের যেকোন একটি বর্ডার স্টাইল ব্যবহার করতে পারেনঃ

  • dotted – ডট(.) দিয়ে বর্ডার তৈরি হবে। যেমনঃ ……
  • dashed – ডেশ(-) দিয়ে বর্ডার তৈরি হবে। যেমনঃ – – – –
  • double – দুইটা বর্ডার লাইন দিয়ে বর্ডার তৈরি হবে।
  • groove – 3D টাইপের বর্ডার তৈরি হয়.
  • ridge – 3D টাইপের বর্ডার তৈরি হয় .
  • inset – 3D টাইপের বর্ডার তৈরি হয় .
  • outset – 3D টাইপের বর্ডার তৈরি হয়
  • none – বর্ডার তুলে দিতে ব্যবহৃত হয়।

Next Previous