সিএসএস বর্ডার টিউটোরিয়াল পর্ব - ১১

এইচটিএমএল এলিমেন্ট এর চারপাশে বর্ডার দেয়া যায়। border-style, border-width, border-color ইত্যাদি প্রোপার্টি দিয়ে এই বর্ডারের অনেক স্টাইল করা যায়।


যেমন

view source
print
?
p.one {
border-style: solid;
border-width: 3px;
border-color: maroon;

}

p.two {
border-style: solid;
border-width: medium;
}
p.three{
border-style: double;
}
p.four{
border-style: groove;
}
p.five{
border-style: dotted;
}
p.six{
border-style: dashed;
}
p.seven{
border-style: inset;
}

p.eight{
border-style: outset;
}
p.nine{
border-style: ridge;
}
p.ten{
border-style: hidden;
}

 প্রয়োগ দেখুন


** border-width প্রোপার্টি টি একা থাকলে কাজ করবেনা, তার আগে border-style দিয়ে আসতে হবে।


চারদিকের বর্ডারের জন্য ৪ রকম স্টাইল করা যাবে যেমন

border-left-width: 10px;
border-right-width: 10px;
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dashed;
border-left-style: ridge;