خصوصیت offset-anchor CSS

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

offset-anchor ویژگی عنصر را مشخص می‌کند که بر روی offset-path نقطه‌هایی که توسط ویژگی تعریف شده‌اند استفاده کنید.

اگر از offset-rotate ویژگی عنصر را می‌چرخاند، سپس offset-anchor نقطه‌هایی که ویژگی تعریف شده است نیز به عنوان مرکز چرخش خواهند شد.

مثال

نقطه مرکزی سمت راست عنصر <img> را بر روی مسیر تعریف شده ثابت نگه دارید:

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

آزمایش کنید

جمله‌بندی CSS

offset-anchor: auto|value|initial|inherit;

مقدار ویژگی

مقدار توضیح
خودکار مقدار پیش‌فرض. نقطه آنکر در مرکز عنصر قرار دارد، معادل مقدار 50% 50% است.
  • left top
  • left center
  • left bottom
  • right top
  • right center
  • right bottom
  • center top
  • center center
  • center bottom
اگر تنها یک کلمه کلیدی مشخص کنید، مقدار دیگر "center" خواهد بود.
xpos ypos

مقدار اولین ارزش موقعیت افقی است، مقدار دوم ارزش موقعیت عمودی است.

کمین گوشه 0 0 است.

واحد می‌تواند پیکسل (0px 0px) یا هر واحد CSS دیگر باشد.

اگر تنها یک مقدار مشخص کنید، مقدار دیگر 50% خواهد بود.

می‌توان ترکیبی از % و موقعیت استفاده کرد.

x% y%

مقدار اولین ارزش موقعیت افقی است، مقدار دوم ارزش موقعیت عمودی است.

کمین گوشه 0% 0% است. گوشه پایین سمت راست 100% 100% است.

اگر تنها یک مقدار مشخص کنید، مقدار دیگر 50% خواهد بود.

مقدار پیش‌فرض: 50% 50%.

مقدار اولیه این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. به: مقدار اولیه.
erbیت‌پذیری این ویژگی را از عنصر والد خود برمی‌گیرد. به: erbیت‌پذیری.

جزئیات فنی

مقدار پیش‌فرض: خودکار
erbیت‌پذیری: خیر
انیمیشن‌سازی: پشتیبانی شده است. لطفاً به:ویژگی‌های مرتبط با انیمیشن.
نسخه: CSS3
جمله‌بندی جاوااسکریپت: object.style.offsetAnchor="bottom right"

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

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

کروم کنار افراد سفاری опера
116 116 72 16 102

صفحات مرتبط

آموزش:مسیر‌های SVG

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

منبع:خصوصیت offset CSS

منبع:خصوصیت offset-distance CSS

منبع:خصوصیت offset-path CSS

منبع:خصوصیت offset-position CSS

منبع:خصوصیت offset-rotate CSS