CSS آفسیٹ کئیتی

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

offset این عامل برای انیمیشن‌سازی عناصر بر روی مسیر استفاده می‌شود و فرمول اختصاری موارد زیر است:

درباره تنظیم offset روش‌های مختلف برای تنظیم مقادیر عامل، لطفاً به مثال‌های بیشتر زیر مراجعه کنید.

استفاده از offset عوامل مختصر برای تنظیم offset-path، offset-distance و offset-rotate برای عناصر <img>:

img {
  offset: path('M 50 80 C 150 -20 250 180 350 80') 150px auto 45deg;
}

استفاده از عنصر <img> برای offset عوامل تنظیم offset-path و offset-rotate:

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

استفاده از عنصر <img> برای offset عوامل تنظیم offset-path و offset-distance:

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

استفاده از عنصر <img> برای offset مقدار تنظیمات ویژگی‌های offset-path،offset-distance،offset-rotate و offset-anchor:

img {
  offset: path('M 50 80 C 150 -20 250 180 350 80') 150px -90deg / 0% 50%;
}

offset: auto|value|initial|inherit;

مقدار	توضیح
auto	پیش‌فرض. لطفاً به مقدار پیش‌فرض هر یک از ویژگی‌های 'offset-' مجزا مراجعه کنید.
افست-انکر	نقطه ثابت روی مسیر انیمیشن عنصر. مقدار پیش‌فرض auto است.
offset-distance	فاصله از شروع مسیر تعریف شده توسط offset-path. مقدار پیش‌فرض 0 است.
offset-path	مسیر انیمیشن عنصر. مقدار پیش‌فرض none است.
offset-position	مقدار موقعیت اولیه عنصر در مسیر. مقدار پیش‌فرض normal است.
offset-rotate	مقدار زاویه چرخش عناصر در حال انیمیشن‌سازی در مسیر. مقدار پیش‌فرض auto است.
initial	این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. ببینید: initial.
inherit	این ویژگی را از عنصر پدرش ارث می‌برد. ببینید: inherit.

مقدار پیش‌فرض:	مقدار پیش‌فرض برای هر یک از ویژگی‌های فردی را ببینید
ارث‌پذیری:	خیر
انیمیشن‌سازی:	پشتیبانی می‌شود. لطفاً به:ویژگی‌های مرتبط با انیمیشن.
نسخه:	CSS3
قوانین جاوااسکریپت:	object.style.offset="path('M 50,250 C 700,-50 -400,-50 250,250') 200px auto 90deg"