CSS বর্ডার প্রপার্টি একটি এলিমেন্টের বর্ডার প্রোপার্টি নির্ধারণ করতে ব্যবহৃত হয়। এটি সীমানা-প্রস্থ, সীমানা-শৈলী এবং সীমানা-রঙের জন্য একটি সংক্ষিপ্ত হাত। বর্ডার-টপ, বর্ডার-ডান, ইত্যাদির মতো পার্শ্ব-নির্দিষ্ট বৈশিষ্ট্যগুলি ব্যবহার করে আমরা পৃথক পক্ষগুলিকে স্টাইল করতে পারি।
সিনট্যাক্স
CSS বর্ডার প্রপার্টির সিনট্যাক্স নিম্নরূপ -
Selector {
border: /*value*/
} উদাহরণ
নিম্নলিখিত উদাহরণগুলি CSS বর্ডার সম্পত্তি −
কে চিত্রিত করে<!DOCTYPE html>
<html>
<head>
<style>
div {
border-style: solid;
margin: auto;
padding: 5px;
border-radius: 50%;
}
#main {
height: 100px;
width: 100px;
border-left: 12px ridge goldenrod;
border-right: 12px ridge goldenrod;
}
#main > div {
line-height: 12px;
height: 30px;
width: 10px;
padding: 27px 20px;
border-top: 6px groove crimson;
border-bottom: 6px ridge crimson;
}
</style>
</head>
<body>
<div id="main">
<div>i see you</div>
</div>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
p {
width: 60%;
margin: auto;
padding: 20px 45px;
border-top-width: 1.4em;
border-top-style: solid;
border-top-color: violet;
border-radius: 85px 85px 0 0;
color: black;
font-size: 1.3em;
background-image: url("https://www.tutorialspoint.com/images/css.png");
}
</style>
</head>
<body>
<p>CSS is used to control the style of a web document in a simple way. It handles the look and feel part of a web page.</p>
</body>
</html>৷ আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
