CSS মার্জিন প্রপার্টি হল মার্জিন-টপ, মার্জিন-ডান, মার্জিন-বটম, এবং মার্জিন-বাম-এর জন্য একটি সংক্ষিপ্ত বিবরণ। এটি আমাদেরকে উপাদানগুলির চারপাশে স্থান নির্দিষ্ট করতে সক্ষম করে। আমরা পৃথক পক্ষের জন্য মার্জিনও সেট করতে পারি।
সিনট্যাক্স
CSS মার্জিন সম্পত্তির সিনট্যাক্স নিম্নরূপ -
Selector {
margin: /*value*/
} উদাহরণ
নিম্নলিখিত উদাহরণগুলি CSS মার্জিন সম্পত্তি −
কে চিত্রিত করে<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: 10px 50px 20px;
padding: 1rem;
border: dashed;
}
p {
text-align: center;
}
#demo {
margin-left: -80px;
box-shadow: inset 0 0 10px brown;
}
</style>
</head>
<body>
<div></div>
<p>This is demo text.</p>
<p id="demo">Another demo text.</p>
<p>This is new demo text.</p>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
ul {
margin: auto;
background-image: linear-gradient(to right, khaki, aliceblue, skyblue, rebeccapurple);
width: 20em;
}
li {
margin-top: 3px;
}
li + li {
margin-left: -20px;
}
li:last-child {
margin-left: 75px;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<ul>
<li>This is demo list item.</li>
<li>This is another list item with different style.</li>
<li>This is our third demo text with another style.
</li>
</ul>
</body>
</html> রূপরেখা
এটি নিম্নলিখিত আউটপুট দেয় -
