ویژگی margin-inline-end CSS

صفحه قبل margin-inline
صفحه بعدی margin-inline-start

تعریف و استفاده

margin-inline-end مقدار حاشیه انتهای جهت خطی را مشخص می‌کنند.

ویژگی‌های CSS margin-inline و margin-block ویژگی‌ها با margin-top،margin-bottom،margin-left و margin-right به طور مشابه است، اما margin-inline و margin-block ویژگی‌ها بستگی به جهت بلوک و جهت خطی دارند.

توجه:ویژگی‌های CSS مرتبط تأثیر می‌گذارد نوع نوشتار و جهت جهت خطی را تعریف می‌کند. این بر روی موقعیت شروع و پایان عنصر و margin-inline-end نتیجه ویژگی. برای صفحات انگلیسی، جهت بلوک به سمت پایین است و جهت خطی از چپ به راست است.

مثال

مثال 1

مقدار حاشیه انتهای جهت خطی را تنظیم کنید:

div {
  margin-inline-end: 35px;
}

آزمایش کنید

مثال 2

وقتی مقدار <div> عنصر نوع نوشتار وقتی مقدار ویژگی 'vertical-rl' تنظیم شود، جهت خطی از بالا به پایین است. نتیجه این است که انتهای عنصر از سمت راست به پایین حرکت می‌کند:

div {
  margin-inline-end: 50px;
  writing-mode: vertical-rl;
}

آزمایش کنید

مثال 3

وقتی مقدار <div> عنصر جهت وقتی مقدار ویژگی 'rtl' تنظیم شود، جهت خطی از راست به چپ است. نتیجه این است که انتهای عنصر از سمت راست به سمت چپ حرکت می‌کند:

div {
  margin-inline-end: 50px;
  direction: rtl;
}

آزمایش کنید

نوع CSS

margin-inline-end: auto|طول|مقدار پیش‌فرض|ارث‌پذیری;

مقدار ویژگی

مقدار	توضیح
자동	مقدار پیش‌فرض. مقدار پیش‌فرض margin-inline-end عنصر.
طول	با استفاده از واحد‌های px، pt، cm و غیره margin-inline-end را مشخص کنید. مقادیر منفی مجاز هستند. لطفاً به:یکای‌های CSS.
%	با استفاده از درصد از اندازه عنصر والد، margin-inline-end را در جهت خطی مشخص کنید.
مقدار پیش‌فرض	این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. لطفاً به: مقدار پیش‌فرض.
ارث‌پذیری	این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً به: ارث‌پذیری.

جزئیات فنی

مقدار پیش‌فرض:	자동
ارث‌پذیری:	خیر
انیمیشن‌سازی:	پشتیبانی می‌شود. لطفاً به:ویژگی‌های مرتبط با انیمیشن.
نسخه:	CSS3
نوع جاوااسکریپت:	object.style.marginInlineEnd="50px"