ویژگی offset-distance CSS

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

offset-distance این ویژگی برای تنظیم فاصله عنصر با مسیر تعریف شده توسط: offset-path فاصله بین نقطه شروع مسیر تعریف شده توسط ویژگی.

مثال

عنصر <img> در مسیر تعریف شده خود قرار دارد و در فاصله 33% از نقطه شروع مسیر قرار دارد.

img {
  offset-path: path('M 50 80 C 150 -20 250 180 350 80');
  offset-distance: 33%;
}

تست شخصی

نوع‌نویسی CSS

offset-distance: auto|length|initial|inherit;

مقدار ویژگی

مقدار توضیح
0 عنصر در نقطه شروع مسیر قرار دارد. مقدار پیش‌فرض.
length

از واحد‌های ثابت (مانند px،pt،cm و غیره) برای مشخص کردن فاصله عنصر تا نقطه شروع مسیر استفاده کنید.

مقدار منفی مجاز نیست. لطفاً به:واحدهای CSS.
% فاصله‌ای را به عنوان درصد از طول مسیر مشخص کنید.
initial این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. به: initial.
inherit این ویژگی از عنصر والد خود ارث می‌برد. به: inherit.

جزئیات فنی

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

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه مرورگر اولین هستند که این ویژگی را کامل پشتیبانی می‌کند.

کروم اژدها فایرفاکس سفاری اپرا
55 79 72 16 42

صفحات مرتبط

آموزش:مسیر SVG

آموزش:آنیماشن CSS

منابع:ویژگی offset CSS

منابع:ویژگی offset-anchor CSS

منابع:ویژگی offset-path CSS

منابع:ویژگی offset-position CSS

منابع:ویژگی offset-rotate CSS