সি এস এস মার্জিন (CSS Margin)

সিএসএস মার্জিন দ্বারা elements এর চার পাশের কিছু ফাঁকা স্থান নির্দেশ করে ।

মার্জিন

Margin দ্বারা element এর চার পাশের clear স্থান (outside the border) কে নির্দেশ করে । Margin এর কোন background color নেই, এটি পুরোপুরি transparent।

Top, right, bottom, and left margin স্বাধীন ভাবে পরিবর্তন করা যায় তাদের আলাদা আলাদা properties ব্যাবহার করে।

সবধরনের margins পরিবর্তন করার জন্য সংক্ষিপ্ত margin property ও ব্যাবহার করা যায়।

সম্ভাব্য মান

মান বর্ণনা
auto এই পদ্ধতি তে browser নিজেই margin calculate করে
length margin বিশেষ ভাবে উল্লেখ করা হয় in px, pt, cm, etc. Default value is 0px
% margin বিশেষ ভাবে উল্লেখ করা হয় in percent of the width of the containing element
inherit margin টি parent element থেকে স্থানান্তরিত হওয়া নির্দেশ করা হয় inherit দ্বারা।

বিঃ দ্রঃ negative values ব্যাবহার করা সম্ভব content overlap করার জন্য।

উদাহরণ


p {
    margin-top: 100px;
    margin-bottom: 100px;
    margin-right: 150px;
    margin-left: 50px;
}

 

মার্জিন - সংক্ষিপ্ত প্রোপার্টি

code কে ছোট করতে ভিন্ন ভিন্ন margin properties কে একটি properties এর মাধ্যমে বর্ণনা করা হয়। একে Shorthand property বলে।
সকল মার্জিন প্রোপার্টি এর জন্য সংক্ষিপ্ত প্রোপার্টি হলো: "margin" ।


p {
    margin: 100px 50px;
}

margin property এক থেকে চার ধরনের মান হতে পারেঃ

  • margin: 25px 50px 75px 100px;
    • top margin is 25px
    • right margin is 50px
    • bottom margin is 75px
    • left margin is 100px
  • margin: 25px 50px 75px;
    • top margin is 25px
    • right and left margins are 50px
    • bottom margin is 75px

margin: 25px 50px;
top and bottom margins are 25px
right and left margins are 50px

margin: 25px;
all four margins are 25px

Permanent link to this article: http://bangla.sitestree.com/%e0%a6%b8%e0%a6%bf-%e0%a6%8f%e0%a6%b8-%e0%a6%8f%e0%a6%b8-%e0%a6%ae%e0%a6%be%e0%a6%b0%e0%a7%8d%e0%a6%9c%e0%a6%bf%e0%a6%a8-css-margin/